Open cmd1000000 opened 5 months ago
import myImageComponent from '@/components/formAgency/myImage.vue' const label = '授权函'; const name = 'myImage'; let i = 1 const uniqueId = () => uni${i++} export default { icon: 'icon-upload', label, name, rule() { return { type: name, field: uniqueId(), title: label, $required:false, component: myImageComponent, props: { imgUrl:'', uploadUrl:'', downloadUrl:'', } }; }, props() { return [{type: 'Required', field: 'formCreate$required', title: '是否必填'}, {type: 'input', field: 'imgUrl', title: '案例地址'}, {type: 'input', field: 'uploadUrl', title: '图片上传地址'}, {type: 'input', field: 'downloadUrl', title: '文件下载地址'}, ]; }, created() { console.log('created hook', this.uploadUrl, this.downloadUrl); }, }; -----------------------------------------------------这是js mounted() { //删除不必要的组件 this.$refs.designer.removeMenu('aide'); this.$refs.designer.removeMenu('layout'); this.$refs.designer.removeMenuItem('colorPicker'); this.$refs.designer.removeMenuItem('slider'); this.$refs.designer.removeMenuItem('rate'); this.$refs.designer.removeMenuItem('el-transfer'); this.$refs.designer.removeMenuItem('tree'); //更新组件 this.$refs.designer.addComponent(myImage) this.$refs.designer.appendMenuItem('main', { icon: myImage.icon, name: myImage.name, label: myImage.label, }) }, methods: { detail(){ if (this.id){ this.axios.get('/formAgency/' + this.id).then(response => { if (response.data.code===200){ this.ruleForm=response.data.data; if (this.ruleForm.form_filed){ this.$refs.designer.setRule(formCreate.parseJson(this.ruleForm.form_filed)); } if (this.ruleForm.form_option){ this.$refs.designer.setOption(formCreate.parseJson(this.ruleForm.form_option)); } } console.log(response) }) } }, 这是在页面中使用的方法
uni${i++}
不要通过component: myImageComponent方式挂载组件, 建议把用到的组件全局挂载 @cmd1000000
component: myImageComponent
好的,我下午试一下,谢谢
import myImageComponent from '@/components/formAgency/myImage.vue' const label = '授权函'; const name = 'myImage'; let i = 1 const uniqueId = () =>
uni${i++}
export default { icon: 'icon-upload', label, name, rule() { return { type: name, field: uniqueId(), title: label, $required:false, component: myImageComponent, props: { imgUrl:'', uploadUrl:'', downloadUrl:'', } }; }, props() { return [{type: 'Required', field: 'formCreate$required', title: '是否必填'}, {type: 'input', field: 'imgUrl', title: '案例地址'}, {type: 'input', field: 'uploadUrl', title: '图片上传地址'}, {type: 'input', field: 'downloadUrl', title: '文件下载地址'}, ]; }, created() { console.log('created hook', this.uploadUrl, this.downloadUrl); }, }; -----------------------------------------------------这是js mounted() { //删除不必要的组件 this.$refs.designer.removeMenu('aide'); this.$refs.designer.removeMenu('layout'); this.$refs.designer.removeMenuItem('colorPicker'); this.$refs.designer.removeMenuItem('slider'); this.$refs.designer.removeMenuItem('rate'); this.$refs.designer.removeMenuItem('el-transfer'); this.$refs.designer.removeMenuItem('tree'); //更新组件 this.$refs.designer.addComponent(myImage) this.$refs.designer.appendMenuItem('main', { icon: myImage.icon, name: myImage.name, label: myImage.label, }) }, methods: { detail(){ if (this.id){ this.axios.get('/formAgency/' + this.id).then(response => { if (response.data.code===200){ this.ruleForm=response.data.data; if (this.ruleForm.form_filed){ this.$refs.designer.setRule(formCreate.parseJson(this.ruleForm.form_filed)); } if (this.ruleForm.form_option){ this.$refs.designer.setOption(formCreate.parseJson(this.ruleForm.form_option)); } } console.log(response) }) } }, 这是在页面中使用的方法