Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

自定义组件新增的时候可以正常新增修改的时候无法渲染组件 #138

Open
cmd1000000 opened this issue May 22, 2024 · 2 comments

Comments

@cmd1000000
Copy link

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)
})
}
},
这是在页面中使用的方法

@xaboy
Copy link
Owner

xaboy commented May 25, 2024

不要通过component: myImageComponent方式挂载组件, 建议把用到的组件全局挂载 @cmd1000000

@cmd1000000
Copy link
Author

不要通过component: myImageComponent方式挂载组件, 建议把用到的组件全局挂载 @cmd1000000

好的,我下午试一下,谢谢

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants