是这样的，在开发项目的时候，我封装了一个工具库函数用来封装全局通用的业务代码，比如判断中文姓名或者身份证的正误，下面是代码示例
export function isPersonName(val) {
let pattern = /^[u4E00-u9FA5]{2,4}$/;
if(pattern.test(val)) {
return true;
}
return false;
}
调用以上的封装函数
import { isPersonName } from "@/utils/format.js"
if(!isPersonName(this.visitingPersonName) || this.visitingPersonName == "") {
this.$toast({
message: `请填写正确的就诊人姓名`,
position: "middle",
duration: 2000
});
return false;
}
此时有了另一个需求，就是需要隐藏身份证中间的年月日，我同样使用相同的方式将其封装在工具库函数中
export function interceptIdCard(val) {
return val.replace(/(d{4})d*([0-9a-zA-Z]{4})/,"$1******$2");
}
在调用的时候就出现问题了
import { interceptIdCard } from "@/utils/format.js"
[Vue warn]: Property or method “interceptIdCard” 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.
看错误提示是interceptIdCard 这个函数对象并未写入Vue实例中，然而为什么第一个栗子却能够跑通呢？这让我百思不得其解，后来只能将interceptIdCard 函数写在Vue实例中methods集合里面才得以正常运行
methods: {
interceptIdCard(val){
return val.replace(/(d{4})d*([0-9a-zA-Z]{4})/,"$1****$2");
}
}
以上是我在开发中的一些分享，如果有人知道如何解决文中的问题，希望告知下啦。
后记解决这个问题了，其实简单的很，怎么自己就想不到，我好菜啊。下面看解决方法
export function interceptIdCard(val) {
return val.replace(/(d{4})d*([0-9a-zA-Z]{4})/,"$1******$2");
}
在组件中引用
import { interceptIdCard } from "@/utils/format.js";
// 切割身份证正则表达式
interceptIdCards(val) {
return interceptIdCard(val);
}
真的是菜死了，麻蛋！
