iT邦幫忙

0

vue 每開一次 dialog 時的檢查?

我的 index.vue 程式,當進去頁面第一個讀的檔案

<template>
    <div>
        <Table></Table>
        <dataDialog></dataDialog>
    </div>
</template>

<script>
import Table from './table'
import dataDialog from './dataDialog'

export default {
    data() {
        return {
            moduleName: 'advertise',
        }
    },
    components: {
        Table,
        dataDialog,
    },
}
</script>

有多筆資料
從 table 透過按鈕 click 事件開啟 dialog

<el-button 
    @click="handleEdit(scope.row)">
</el-button>
    
handleEdit(row) {
      this.$store.commit(`abc/UPDATE_STATE`, 'dataDialogVisible', true)
},

dialog

export default {
    data() {
        return {
            isUnlimited: false,
        }
    },
    created() {
        this.handleCheckboxUnlimited()
    },
    methods: {
        handleCheckboxUnlimited() {
            if (this.endTime.indexOf('3020') !== -1)
                this.isUnlimited = true
        },
    }
}

我想做到的是
每一筆資料都有一個 endTime
每次開啟都檢查該筆資料的 this.endTime.indexOf('3020') !== -1
若有則 this.isUnlimited = true
只是 created 是只會執行一次,除非刷新
若是這樣有啥方式可以每當開啟 dialog 時就(執行 handleCheckboxUnlimited()一次)檢查該筆資料的 endTime

或是說直接存 Vuex 算了⋯⋯⋯⋯

listennn08 iT邦研究生 1 級 ‧ 2020-08-07 16:59:03 檢舉
dialog 裡的資料是從 table 過去?
松松 iT邦研究生 2 級 ‧ 2020-08-09 20:17:18 檢舉
應該是說開啟 dialog 按下按鈕時,我會把 table 給的資料帶到 VUEX
listennn08 iT邦研究生 1 級 ‧ 2020-08-10 09:18:46 檢舉
那就在 dialog 裡面 watch 那個資料
關閉 dialog 就清空資料
其實跟用 props 邏輯差不多

1 個回答

2
froce
iT邦大師 1 級 ‧ 2020-08-07 18:32:35
最佳解答

<dataDialog v-if="switch"></dataDialog>

發射時順便讓switch變成true,關閉dataDialog改成false...這樣才不會被cache住。
超過三層才比較需要用vuex,你這個看來還不太需要,太少層vuex寫的code還比較多。

松松 iT邦研究生 2 級 ‧ 2020-08-09 21:26:56 檢舉

不同的 components 如何互通?(不使用VUEX的話)
我有遇過 Avoid mutating a prop directly since the value will be overwritten whenever the parent component re-renders. 的問題

froce iT邦大師 1 級 ‧ 2020-08-10 00:25:52 檢舉

發射到父元件然後傳到子元件啊。
你不能直接改子元件的prop值,但你可以發射到父元件去叫父元件改。
這不是單向數據流的基本嗎?

我要發表回答

立即登入回答