codecamp

自定义组件常见问题

Q. 自定义组件支持安装三方的 NPM 包吗?

A:暂时不支持,可以采用动态加载 CDN 的资源方式。

function loadScript(src, callback) {
  if (!src) {
    return;
  }
  const node = document.createElement('script');
  node.src = src;
  node.addEventListener('load', callback, false);
  document.head.appendChild(node);
}

function loadCss(url) {
  const linkElement = document.createElement('link');

  linkElement.rel = 'stylesheet';
  linkElement.href = url;
  document.body.appendChild(linkElement);
}

(function loadAssets() {
  loadCss('https://dev.g.alicdn.com/yida-platform/react-cropper/1.0.0/css/react-cropper.css');
  loadScript('https://dev.g.alicdn.com/yida-platform/react-cropper/1.0.0/js/react-cropper.js', () => {
    // your code 
  });
})();

Q. 组件安装后,在面板里看不到?A: 检查下安装范围

Q. 自定义组件如何在表单中提交数据?

A: 目前宜搭的自定义组件还未开放表单组件,若想要提交数据可以采用填充到已有的表单组件的方式。例如:声明一个 唯一标识 的属性,在使用时传入已有的表单唯一表单,在组件侧通过事件将需要的数据回填到已存在的表单上。


自定义组件案例 - 图片裁剪上传(高阶)
大屏设置
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

报表设置

大屏设置

自定义页面设置

付费功能

开发者功能(需有代码基础)

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }