黎明即起,醒后勿粘恋。
背景
根据数据的类型对数据做处理,首先想到的是用v-if + filters(过滤符)对数据类型做判断,之后再处理数据,判断如果数据是字符串的时候就直接赋值,如果是数组的话就做for循环处理! 想法个人感觉思路是对的,但是现实piapia打脸,首先如此写完之后会报错.
第一种方法代码如下:
<template slot-scope="scope">
<p v-if="scope.row.exchangeDate | judgeType">{{scope.row.versionDesc}}</p>
<p v-else v-for="(item,index) in scope.row.versionDesc" :key="index">{{item}}</p>
</template>
<script>
filters: {
judgeType(val) {
return typeof val !== 'object';
}
}
</script>
报错信息:
[Vue warn]: Property or method "judgeType" is not defined on the instance but referenced during render. Make sure that this property is reactive, either in the data option, or for class-based components, by initializing the property. See: [https://vuejs.org/v2/guide/reactivity.html#Declaring-Reactive-Properties]
资质愚钝,翻阅各大资料,没看懂个因为所以,还是要看书看文档啊!!!
处理方法
换个思路做处理,将filters的处理方式改为methods的方法处理,方式如下
第二种方法代码如下:
<template slot-scope="scope">
<p v-if="judgeType(scope.row.exchangeDate)">{{scope.row.versionDesc}}</p>
<p v-else v-for="(item,index) in scope.row.versionDesc" :key="index">{{item}}</p>
</template>
<script>
methods: {
judgeType(val) {
return typeof val !== 'object';
}
}
</script>
方法搞定,满足我目前的需求,继续研究第一种思路为什么回报错,如果有大神看见,请为菜鸟解惑!!!