console
const { createApp } = Vue
createApp({
data() {
return {
rule: [
{
type:'upload',
field:'image',
title:'图片',
props: {
listType: "picture-card",
action: 'https://jsonplaceholder.typicode.com/posts/',
onSuccess(file){
file.url = file.response.url || 'http://form-create.com/logo.png'
console.log(arguments)
}
},
effect: {
required: '请上传图片'
},
value: []
},
{
type:'spanCom',
field:'span',
component: {
emits: ['update'],
methods: {
handleClick() {
setTimeout(() => {
this.$emit('update')
}, 200)
}
},
template: `
<span @click="handleClick">
点击
</span>
`
},
title:'按钮',
inject: true,
value: '',
children: ['点击'],
effect: {
required: '请点击按钮'
},
on: {
update(inject) {
console.log('update')
inject.self.value = [1]
}
}
}
]
}
},
methods: {
handleSubmit(...rest) {
console.log(rest)
}
}
}).use(formCreate).mount('#app')
<link rel="stylesheet" href="https://unpkg.com/ant-design-vue@3.0.0-alpha.11/dist/antd.min.css"></link>
<script src="https://cdn.jsdelivr.net/npm/vue@3.2.31/dist/vue.global.prod.js"></script>
<script src="https://unpkg.com/dayjs"></script>
<script src="https://unpkg.com/ant-design-vue@3.0.0-alpha.11/dist/antd.min.js"></script>
<script src="https://unpkg.com/@form-create/ant-design-vue@3.1.11/dist/form-create.min.js"></script>
<div id="app">
<form-create :rule="rule" @submit="handleSubmit" />
</div>