我的應用程式中有一個段落，用戶可以在其中單擊一個按鈕來翻譯??它。我插入通過我的道具（props.row.text）和我的資料（this.data.translatedText）看到的文本。
在單擊按鈕之前，資料屬性為空/空，因此導致我在控制臺中收到錯誤“資料為空”。我嘗試使用下面的代碼解決此問題，但是，這會引發錯誤，但在單擊按鈕后不顯示插值文本。
有沒有人建議如何最好地構建它，以便在單擊按鈕后將 {{ props.row.text }} 替換為 {{ this.data.translatedText }}？
組件.vue
<span id="translationButton">
<translation-button @click="calltranslatedText()" @changeTitle="ChangeT" />
</span>
<div >{{ props.row.text }}</div>
<div v-if="calltranslatedText()">{{ this.data.translatedText }}</div>
methods: {
ChangeT(title)
{
this.translatedText = title
},
calltranslatedText() {
return true
},
uj5u.com熱心網友回復：
首先不要使用thisanddata在模板中只指示你在data函式中定義的道具名稱。
其次，您可以使用translatedTextinv-if來顯示div翻譯的文本。
<div class="ticket-text-container" v-if="translatedText">{{ translatedText }}</div>
如果需要，不要忘記設定translatedText為空字串或null再次隱藏此塊。
轉載請註明出處，本文鏈接：https://www.uj5u.com/houduan/359412.html