vuejs組件內的props的屬性賦值問題?
問題描述
組件:<test :loading.sync="loading"></test>
Vue.component('test',{ template: '#testText', props: { loading: { type: Boolean, default: false} }, methods: {getData: function (data) { this.loading = false;//此句有錯誤,該如何更正} }});new Vue({el: '#indexBox',data: { loading : false},methods : {loadMore: function () { this.loading = true;} } });
我想在子組件里面變更loading的值回傳給父組件,請問該如何控制loading
問題解答
回答1:你用的是vue2吧,如果是vue2的話就應該用事件來把子組件的狀態傳給父組件,有兩種辦法,一種是在父組件中傳一個v-model='outerLoading',然后子組件里面
watch:{ outerLoading (v) {this.innerLoading = v }, innerLoading (v) {this.emit('input', v) }}
這樣outLoading就會響應innerLoading,實現雙向綁定的功能。還有一種做法和這個類似,就是把this.emit('input', v)換成this.emit('eventName', v),然后在父組件中@eventName='eventFunc', 再通過父組件中的eventFunc(v) { //code... }來響應子組件的狀態
相關文章:
1. python - 爬蟲模擬登錄后,爬取csdn后臺文章列表遇到的問題2. javascript - 求幫助 , ATOM不顯示界面!!!!3. javascript - angular使從elastichearch中取出的文本高亮顯示,如圖所示4. 視頻文件不能播放,怎么辦?5. python bottle跑起來以后,定時執行的任務為什么每次都重復(多)執行一次?6. mysql - 分庫分表、分區、讀寫分離 這些都是用在什么場景下 ,會帶來哪些效率或者其他方面的好處7. javascript - ios返回不執行js怎么解決?8. javascript - 移動端自適應9. html5 - HTML代碼中的文字亂碼是怎么回事?10. mysql 查詢身份證號字段值有效的數據
