问题描述
我在index.html是这样写的:
<html>
<body>
<div id="app">
<sidenav>...</sidenav>
<navbar>...</navbar>
</div>
<script src="main.js"/>
</body>
</html>
main.js:
const app = new Vue({
el: "#app",
data: {...},
method: {...}
});
在main.js中的vue app里面定义了navbar和sidenav的一些data和method,我想在其他页面都能使用这个配置。
比如在profile.html中:
<html>
<body>
<div id="app">
<sidenav>...</sidenav>
<navbar>...</navbar>
{{ content... }}
</div>
<script src="profile.js"/>
</body>
</html>
我希望在profile中能使用main.js中的app,但同时在profile又会有自己的vue配置,比如:
profile.js:
const profile = new Vue({
el: "#app",
data: {...},
method: {...}
});
有什么办法可以将两个配置合并呢
自己尝试过的方法
我刚开始将navbar和sidenav写成了单文件组件,但这样在其他页面中就不能使用其中的data和methods了
将 navbar 和 sidenav 的数据保存到 vuex 上去操作。