新聞中心
這里有您想知道的互聯(lián)網(wǎng)營銷解決方案
vue-父子組件和ref實例詳解-創(chuàng)新互聯(lián)
父組件向子組件傳值
// 創(chuàng)建 Vue 實例,得到 ViewModel var vm = new Vue({ el: '#app', data: { msg: '123 啊-父組件中的數(shù)據(jù)' }, methods: {}, components: { // 結(jié)論:經(jīng)過演示,發(fā)現(xiàn),子組件中,默認無法訪問到 父組件中的 data 上的數(shù)據(jù) 和 methods 中的方法 com1: { data() { // 注意: 子組件中的 data 數(shù)據(jù),并不是通過 父組件傳遞過來的,而是子組件自身私有的,比如: 子組件通過 Ajax ,請求回來的數(shù)據(jù),都可以放到 data 身上; // data 上的數(shù)據(jù),都是可讀可寫的; return { title: '123', content: 'qqq' } }, template: '這是子組件 --- {{ parentmsg }}
', // 注意: 組件中的 所有 props 中的數(shù)據(jù),都是通過 父組件傳遞給子組件的 // props 中的數(shù)據(jù),都是只讀的,無法重新賦值 props: ['parentmsg'], // 把父組件傳遞過來的 parentmsg 屬性,先在 props 數(shù)組中,定義一下,這樣,才能使用這個數(shù)據(jù),只讀,寫的話會報警告 directives: {}, filters: {}, components: {}, methods: { change() { this.parentmsg = '被修改了' } } } } });
名稱欄目:vue-父子組件和ref實例詳解-創(chuàng)新互聯(lián)
標題來源:http://www.dlmjj.cn/article/dgghjg.html