Javascript 是否可以在不创建计算属性或数据属性的情况下清理道具
假设我有一个定义如下的vue组件:Javascript 是否可以在不创建计算属性或数据属性的情况下清理道具,javascript,vue.js,sanitization,vue-props,Javascript,Vue.js,Sanitization,Vue Props,假设我有一个定义如下的vue组件: TestSelect.vue <template> <v-select v-model="selectValue" :items="items" item-text="name" item-value="id" @change="changed" > </v-select>
TestSelect.vue
<template>
<v-select
v-model="selectValue"
:items="items"
item-text="name"
item-value="id"
@change="changed"
>
</v-select>
</template>
<script>
export default {
props: {
link: String,
items: Array,
value: Number,
},
data: (props) => ({
selectValue: props.value,
saneLink: props.link.slice(-1) == "/" ? props.link : `${props.link}/`,
}),
methods: {
changed(value) {
document.location = this.saneLink + value;
},
},
};
</script>
导出默认值{
道具:{
链接:字符串,
项目:阵列,
值:Number,
},
数据:(道具)=>({
选择值:props.value,
saneLink:props.link.slice(-1)=“/”?props.link:`${props.link}/`,
}),
方法:{
更改(值){
document.location=this.saneLink+值;
},
},
};
这项工作很好,可用于以下两种情况:
<test-select
link="test"
:value="1"
:items="[
{ id: 1, name: 'dogbert' },
{ id: 2, name: 'pointy' },
]"
></test-select>
或者
<test-select
link="test/"
:value="1"
:items="[
{ id: 1, name: 'dogbert' },
{ id: 2, name: 'pointy' },
]"
></test-select>
虽然这很好,但出于好奇和简化代码的愿望,我想知道是否有一种方法可以在不定义新数据或计算属性的情况下清理道具。不幸的是,现在您只能直接在Vue中验证道具,而不能清理道具 为了减少Vue捆绑包的大小,故意删除了对道具进行消毒的功能,因为使用您提到的计算属性可以实现相同的效果 不幸的是,这是首选的方法 但是,您可以编写一个自定义插件来实现道具清理 通过粗略的谷歌搜索(请不要在没有先审核代码的情况下盲目使用此插件),我发现此Vue插件旨在允许您将道具强制转换为其他值 我不能保证该代码的有效性,或者它可能存在的任何问题,但它是使用推荐的计算属性的替代方法