繁花如伊
2022-10-27 16:52:17
我制作了一個包含兩條路線的頁面,一個是主頁,另一個是配置,您可以在其中決定應該將什么寫入該容器,現在在配置面板中我能夠獲取輸入值,我使用地圖將它們置于我的狀態現在我得到一個包含字符串值的數組。如何使用 mapGetters 訪問該數組?我鏈接我的代碼:<template> <body> <div class="container"> <h1 v-show="elementVisible" class="info">{{ message }}</h1> </div> </body></template><script> import moment from "moment"; import { mapGetters } from "vuex"; export default { name: "Home", data() { return { // message: this.store.state.message elementVisible: true }; }, computed: { ...mapGetters(["message", "sec"]), ...mapGetters({ message: "message", sec: "sec" }), createdDate() { return moment().format("DD-MM-YYYY "); }, createdHours() { return moment().format("HH:mm "); } }, mounted() { this.$store.dispatch("SET_MESSAGE"); this.$store.dispatch("SET_SEC"); setTimeout(() => (this.elementVisible = false), this.sec); } };</script>所以我要做的就是將我從配置面板收到的消息放入該{{message}}模板中,并且它現在處于我的狀態,作為字符串數組坐在那里,例如,[“hello”, “你好嗎”] 他們就是這樣坐在那里的,所以我怎么能抓住第一個('hello')并將其寫成一個干凈的字符串而不是 ["hello"]他們會更好。
1 回答
阿波羅的戰車
TA貢獻1862條經驗 獲得超6個贊
您好,歡迎來到 Stack Overflow!您的messageArray 使用 正確映射mapGetters,但是當您使用 將其放入模板中時,您將其展平為字符串{{message}},因為模板插值邏輯將對象轉換為字符串,與Array.toString本例中的調用相同。你需要迭代它,即使用v-for指令:
<template>
<body>
<div class="container">
<h1 v-show="elementVisible" class="info">
<span v-for="m of message" :key="m">{{m}}</span>
</h1>
</div>
</body>
</template>
當然,如果你只需要第一項,你可以直接使用:
<template>
<body>
<div class="container">
<h1 v-show="elementVisible" class="info">{{message[0] || 'No message'}}</h1>
</div>
</body>
</template>
添加回答
舉報
0/150
提交
取消
