美文网首页
vue3+ts 搭建系统问题小结

vue3+ts 搭建系统问题小结

作者: drneilc | 来源:发表于2022-03-15 16:50 被阅读0次

自定义组件v-model报错

  "不能将类型“{ modelValue: { week: string; number: number; startTime: string; endTime: string; }[]; }”分配给类型“IntrinsicAttributes & (Partial<{ [x: number]: string; } | {}> & Omit<(readonly string[] | Readonly<ExtractPropTypes<Readonly<ComponentObjectPropsOptions<Data>>>>) & (VNodeProps & ... 2 more ... & Readonly<...>), never>)”。\n  不能将类型“{ modelValue: { week: string; number: number; startTime: string; endTime: string; }[]; }”分配给类型“IntrinsicAttributes & Partial<{}> & Omit<(readonly string[] | Readonly<ExtractPropTypes<Readonly<ComponentObjectPropsOptions<Data>>>>) & (VNodeProps & ... 2 more ... & Readonly<...>), never>”。",

解决方案:使用v-model:xx格式

// 父
NumberList(v-model:list="numberList" @change="handleChangeNumber")

// 子
props: {
    list: {
        type: Array as PropType<NumberType[]>,
            default: () => {
            return [];
            }
    }
},

setup(props, { attrs, emit }) {
    const numberList: any = computed({
        get() {
            return props.list;
        },
        set(val) {
            emit("update:list", val);
        }
    });
})

ts声明props类型

import { computed, ref, defineComponent, PropType } from "vue";
props: {
  list: {
      type: Array as PropType<NumberType[]>,
      default: () => {
       return [];
      }
  }
}

使用pug模板

安装pug编译模板,但是开发过程中prettier格式化对pug并不生效,经过多次尝试,确定可用的方法为vetur手动格式化(我的编辑器默认格式化工具是prettier),编辑器vetur配置为"vetur.format.defaultFormatter.pug": "prettier",

image.png image.png

相关文章

  • vue3+ts 搭建系统问题小结

    自定义组件v-model报错 解决方案:使用v-model:xx格式 ts声明props类型 使用pug模板 安装...

  • 策略PM入门学习(三)

    2.3 【实例】效果监控系统搭建 网页搜索中图片类特型结果的监控体系 2.4 【实例】策略监控系统搭建 小结:...

  • 0到1的vue3+ts+vite前端Web项目搭建

    为了熟悉vue3+ts的开发风格,搭建的一个仿小红书的WebApp(已开源);持续迭代中...... gitHub...

  • 分布式架构的数据一致性

    最近在使用springboot搭建微服务架构,遇到数据一致性问题,今天就对它进行一个小结。 数据一致性是分布式系统...

  • 周小结(4.15日~4.21六)

    周小结(4.15日~4.21六 ) 这周的情况小结一下: 对照着输入系统: 1、以人为师。这周没向别人请教问题。 ...

  • 周小结(4.22日~4.28六 )

    周小结(4.22日~4.28六 ) 这周的情况小结一下: 对照着输入系统: 1、以人为师。这周没向别人请教问题。 ...

  • 周小结(6.10日~6.16六 )

    周小结(6.10日~6.16六 ) 这周的情况小结一下: 对照着输入系统: 1、以人为师。这周向别人请教近视问题。...

  • 搭建企业数据分析系统的过程(二)

    上一遍文章已经写了搭建企业数据分析系统整体框架、系统体系,这次就说说搭建过程中的步骤和遇到的问题。 一、搭建步骤 ...

  • Vue3+TS:后台管理系统

    项目地址:Vue3+TS:后台管理系统 终端执行npm run serve运行项目,复制终端打印的地址到浏览器即可...

  • 周小结(4.29日~5.5六)

    周小结(4.29日~5.5六 ) 这周的情况小结一下: 对照着输入系统: 1、以人为师。这周没向别人请教问题。 2...

网友评论

      本文标题:vue3+ts 搭建系统问题小结

      本文链接:https://www.haomeiwen.com/subject/afyydrtx.html