我有一個帶有 Typescript 的 Vue 2 NuxtJS 專案設定，我想利用unknownTypescript中的關鍵字。
在我的組件中，我收到一個像這樣宣告的道具
props: {
items: {
type: Array as () => LabelValuePair[],
required: true,
},
},
LabelValuePair在這里宣告
interface LabelValuePair {
label: string;
value: unknown;
}
在我的模板中，我想使用這樣的東西
<li v-for="item in items" :key="item.value as string">
<span>
{{ item.label }}: <strong>{{ item.value }}</strong>
</span>
</li>
問題是，與三元運算子一樣，asTypescript 關鍵字不被 vue 編譯器識別為有效語法。
是否有解決方案或解決方法至少可以避免做如下愚蠢的事情？
setup(props) {
const castItems = props.items.map((item) => ({
...item,
value: item.value as string,
}));
return { castItems };
},
uj5u.com熱心網友回復：
如果LabelValuePair應該被重用并且期望string在道具中具有價值，那么泛型型別就是這種情況：
interface LabelValuePair<T = unknown> {
label: string;
value: T;
}
和
items: {
type: Array as PropType<LabelValuePair<string>[]>,
required: true,
},
轉載請註明出處，本文鏈接：https://www.uj5u.com/gongcheng/372382.html