vue 非父子傳值
阿新 • • 發佈:2018-12-15
掛載方法
**main.js**
let bus = new Vue()
Vue.prototype.bus = bus
元件傳送
**header元件** <template> <header @click="changeTitle">{{title}}</header> </template> <script> export default { name: 'header', data () { return { title: '頭部' } }, methods: { changeTitle () { this.bus.$emit('toChangeTitle','首頁') } } } </script>
元件接收值
**footer元件** <template> <footer>{{txt}}</footer> </template> <script> export default { name: 'footer', mounted () { this.bus.$on('toChangeTitle', function (title) { console.log(title) }) }, data () { return { txt: '尾部' } } }