diff --git a/src/components/generator/ruleTrigger.js b/src/components/generator/ruleTrigger.js index 7f33f1a8..3c161b5d 100644 --- a/src/components/generator/ruleTrigger.js +++ b/src/components/generator/ruleTrigger.js @@ -1,4 +1,3 @@ - /** * 用于生成表单校验,指定正则规则的触发方式。 * 未在此处声明无触发方式的组件将不生成rule!! diff --git a/src/components/parser/Parser.vue b/src/components/parser/Parser.vue index 75dc01d0..e368c023 100644 --- a/src/components/parser/Parser.vue +++ b/src/components/parser/Parser.vue @@ -25,7 +25,7 @@ const layouts = { - + ) diff --git a/src/utils/index.js b/src/utils/index.js index 7069c72e..1f0e86ec 100644 --- a/src/utils/index.js +++ b/src/utils/index.js @@ -141,3 +141,17 @@ export function deepClone(obj) { return result } + +const toStr = Function.prototype.call.bind(Object.prototype.toString) +export function isObjectObject(t) { + return toStr(t) === '[object Object]' +} +export function isObjectArray(t) { + return toStr(t) === '[object Array]' +} +export function isObjectNull(t) { + return toStr(t) === '[object Null]' +} +export function isObjectUnde(t) { + return toStr(t) === '[object Undefined]' +} diff --git a/src/views/index/Home.vue b/src/views/index/Home.vue index 87fe1c17..06e3673d 100644 --- a/src/views/index/Home.vue +++ b/src/views/index/Home.vue @@ -133,7 +133,7 @@ import { inputComponents, selectComponents, layoutComponents, formConf } from '@/components/generator/config' import { - exportDefault, beautifierConf, isNumberStr, titleCase, deepClone + exportDefault, beautifierConf, isNumberStr, titleCase, deepClone, isObjectObject } from '@/utils/index' import { makeUpHtml, vueTemplate, vueScript, cssStyle @@ -267,22 +267,27 @@ export default { }) }, methods: { - setObjectValueByStringKeys(obj, strKeys, val) { + setObjectValueReduce(obj, strKeys, data) { const arr = strKeys.split('.') arr.reduce((pre, item, i) => { if (arr.length === i + 1) { - pre[item] = val - } else if (Object.prototype.toString.call(pre[item]) !== '[Object Object]') { + pre[item] = data + } else if (!isObjectObject(pre[item])) { pre[item] = {} } return pre[item] }, obj) }, - setRespData(component, respData) { + setRespData(component, resp) { const { dataPath, renderKey, dataConsumer } = component.__config__ if (!dataPath || !dataConsumer) return - const data = dataPath.split('.').reduce((pre, item) => pre[item], respData) - this.setObjectValueByStringKeys(component, dataConsumer, data) + const respData = dataPath.split('.').reduce((pre, item) => pre[item], resp) + + // 将请求回来的数据,赋值到指定属性。 + // 以el-tabel为例,根据Element文档,应该将数据赋值给el-tabel的data属性,所以dataConsumer的值应为'data'; + // 此时赋值代码可写成 component[dataConsumer] = respData; + // 但为支持更深层级的赋值(如:dataConsumer的值为'options.data'),使用setObjectValueReduce + this.setObjectValueReduce(component, dataConsumer, respData) const i = this.drawingList.findIndex(item => item.__config__.renderKey === renderKey) if (i > -1) this.$set(this.drawingList, i, component) },