我有一個組件，我在另一個組件中呼叫它：
組件 1
<template>
<FiltersComponent />
</template>
export default Vue.extend({
components: { FiltersComponent }
)}
所以，這個 FiltersComponents 有一些我想訪問到我的組件的引數
組件 2 資料
data() {
return {
TestList: [] as string[],
Test2List: null as string[] | null,
}
},
如何訪問 COMPONENT 1 中的 TestList 和 Test2List？
uj5u.com熱心網友回復：
有多種可能性：如果一個組件是另一個組件的子組件或兄弟組件，您可能希望在props（向下傳遞資料）和events（向上傳遞資料）處進行回圈。否則，如果他們不是兄弟姐妹或孩子，您可以使用類似vuex.
要使用檔案示例：
vue 入口點：（例如，app.js）：
import { createApp } from 'vue'
import { createStore } from 'vuex'
// Create a new store instance.
const store = createStore({
state () {
return {
someProperty: 'someValue'
}
},
mutations: {
update (state, value) {
state.someProperty = value
}
}
})
const app = createApp({ /* your root component */ })
// Install the store instance as a plugin
app.use(store)
在您的組件的- 部分script：
this.$store.commit('update', 'YOUR_VALUE')
其他組件：
const val = this.$store.state.someProperty
然而，這只是一個非常基本的例子。你絕對應該查看檔案，尤其是關于state、getters和mutation的部分。
uj5u.com熱心網友回復：
始終根據需要將狀態存盤在組件樹中的最高位置，這意味著如果您需要在組件 1 中使用這些串列，請將它們存盤在那里。然后，您可以使用道具和事件來訪問和更新組件 2 中的資料。
或者，您可以使用像 Vuex 這樣的集中式存盤。
uj5u.com熱心網友回復：
您可以使用ref,
檢查以下示例
<template>
<FiltersComponent ref="childComponent" /> <!-- Adding ref over here -->
</template>
export default Vue.extend({
components: { FiltersComponent }
)}
然后在組件 1 中的任何方法或已安裝部分中。您可以訪問 Component2 資料，例如
this.$refs.childComponent.TestList
或者
this.$refs.childComponent.Test2List
是不是很簡單？;)
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/473057.html
上一篇：將嵌套陣列替換為新陣列