报错<script setup>
cannot contain ES module exports vue/no-export-in-script-setup
vue3-json-schema-form课程中StringField.vue照着打报错
原代码如下:
<template> <input type="text" :value="value" @input="handleChange" /> </template> `<script lang="ts" setup="props"> import { ref } from 'vue' import { FiledPropsDfine, Schema } from '../types' export default { props: FiledPropsDfine, } declare const props: { // 向ts声明props的定义 value: any onChange: (v: string) => void schema: Schema } export const handleChange = (e: any) => { console.log(e) props.onChange(e.target.value) } </script>
复制
修改后代码如下:
<template> <input type="text" :value="value" @input="handleChange" /> </template> `<script lang="ts" setup="props"> import { FiledPropsDfine, Schema } from '../types' declare const props: FiledPropsDfine & { // 向ts声明props的定义 value: any onChange: (v: string) => void schema: Schema } const handleChange = (e: any) => { console.log(e) props.onChange(e.target.value) } </script>
复制
type.ts文件代码片段如下:
import { SchemaRefs } from 'ajv/dist/compile' import { PropType } from 'vue' export enum SchemaTypes { 'NUMBER' = 'number', 'INTEGER' = 'intrger', 'STRING' = 'string', 'OBJECT' = 'object', 'ARRSY' = 'array', 'BOOLEAN' = 'boolean', } type SchemaRef = { $ref: string } // 预先定义 可以使用$ref引用schema // type Schema = any export interface Schema { type: SchemaTypes | string // 加上string有利于类型的校验 要不然只能用SchemaTypes.NUMBER来使用类型 const?: any format?: string default?: any properties?: { [key: string]: Schema | { $ref: string } } items?: Schema | Schema[] | SchemaRefs dependencies?: { [key: string]: string[] | Schema | SchemaRef } oneOf?: Schema[] anyOf?: Schema[] allOf?: Schema[] // vjsf?: VueJsonSchemaConfig required?: string[] enum?: any[] enumKeyValue?: any[] additionalProperties?: any additionalItems?: Schema } export const FiledPropsDfine = { schema: { type: Object as PropType<Schema>, required: true, }, value: { required: true, }, onChange: { type: Function as PropType<(v: any) => void>, required: true, }, rootSchema: { type: Object as PropType<Schema>, required: true, }, } as const
复制
主要问题就是说script标签中加上setup,代码块中不能再出现export default关键字,将该部分代码
export default { props: FiledPropsDfine, } declare const props: { // 向ts声明props的定义 value: any onChange: (v: string) => void schema: Schema }
复制
修改为:
declare const props: FiledPropsDfine & { // 向ts声明props的定义 value: any onChange: (v: string) => void schema: Schema }
复制