定义一个父组件
/ ============ * Home Index Page * ============ * * The home index page.
/
import VLayout from ‘@/layouts/Default’;
import VCard from ‘@/components/Card’;
import MyButton from ‘@/components/MyButton’;
export default {
/ * The name of the page.
/
name: ‘home-index’,
data() {
return {
show: true,
showDate: “父子间传过来的数据”
}
},
methods: {
toggle1(){
this.show =false;
},
toggle(data) {
console.log(data)
this.show = data;
}
},
mounted() {
// this.toggle();
},
/_ * The components that the page can use.
_/
components: {
VLayout,
VCard,
MyButton
},
};
再定义一个子组件
export default { props: \["showDate"\], methods: { toggle1() { this.$emit('toggleEvent', "false") } }}
将父组件的数据通过 porps 传递到子组件,子组件通过 this.$emit(‘触发的事件函数’,要传输的数据)
就目前来说(组件之间传递数据共有三种方法):
1.通过父子组件之间的通信
2.通过 vuex
3.通过路由传参
要说的就这么多,晚安~~~