1、vue3中ref获取不到组件实例

原因:使用语法糖的组件是默认关闭的,也即通过模板 ref 或者 $parent 链获取到的组件的公开实例,不会暴露任何在<script setup>中声明的绑定。

解决方法: 为了在 语法糖组件中明确要暴露出去的属性,使用 defineExpose 编译器宏将需要暴露出去的变量与方法放入暴露出去就可以了

jsdefineExpose({
    getList,
})

2、数组中对象的属性值去重

方法一:

let list = [
        {name:'张三',age:1,},
        {name: '李四',age: 10,},
        {name: '王二',age: 15,},
        {name: '赵五',age: 17,},
        {name: '王二',age: 5,},
        {name: '李四',age: 19,},
    ];
let newList = [];
list.forEach((item) => {
    newList.push(item);
    // 去重
    const ChangeArr = (data) => {
        const newobj = {};
        if (data && data.length > 0) {
            data.forEach((item) => {
                newobj[item.name] = item;
            });
        }
        return newobj;
    };
    let obj = ChangeArr(newList);
    newList = Object.values(obj);
});
console.log('🚀', newList)

方法二:

let list = [
   {name:'张三',age:1,},
   {name: '李四',age: 10,},
   {name: '王二',age: 15,},
   {name: '赵五',age: 17,},
   {name: '王二',age: 5,},
   {name: '李四',age: 19,},
 ];
let obj = {};
list = list.reduce(function (item, next) {
    obj[next.name] ? '' : obj[next.name] = true && item.push(next);
    return item;
}, []);
console.log('🚀', list)

3、筛选符合需要的字段并添加到新数组中(动态添加表单)

let arr = [];
Object.getOwnPropertyNames(this.msgTypeInData).forEach((item,index) => {
     if(item.indexOf('cardNum') !== -1) {
     arr.push({
        amount:this.msgTypeInData.amount,
        cardNum: this.msgTypeInData[item],
        })
     }
})
console.log('🚀', arr)

Object.getOwnPropertyNames(obj)返回一个由指定对象的所有自身属性的属性名(包括不可枚举属性但不包括 Symbol 值作为名称的属性)组成的数组

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐