Skip to content

Commit 01b9915

Browse files
lljj-xlljj-x
committed
feat(lib): 支持配置 getWidget function回调接收 widget组件实例
build(lib): build lib，支持获取widget组件实例 re #25
1 parent aefb8c2 commit 01b9915

File tree

8 files changed

+67
-19
lines changed

8 files changed

+67
-19
lines changed

‎packages/demo/src/vue-editor/views/editor/viewComponents/Text/uiSchema.js‎

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,12 @@
44

55
export default {
66
txt: {
7-
'ui:placeholder': '输入你的内容'
7+
'ui:placeholder': '输入你的内容',
8+
'ui:options': {
9+
getWidget(widgetVm) {
10+
console.log(widgetVm);
11+
}
12+
}
813
},
914
txtColor: {
1015
'ui:widget': 'el-color-picker'

‎packages/docs/docs/zh/guide/basic-config.md‎

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -160,6 +160,13 @@ uiSchema = {
160160
'ui:labelWidth': '50px',
161161

162162
'ui:options': {
163+
// 获取widget组件实例，非必要场景不建议使用
164+
// widget组件 mounted 组件后回调该方法传出vm实例
165+
// 支持版本: "0.4.1"
166+
getWidget: (widgetVm) => {
167+
console.log(widgetVm);
168+
},
169+
163170
// 显示标题？只对 type为`object`、`array` 类型有效
164171
showTitle: true,
165172

‎packages/lib/dist/vueJsonSchemaForm.esm.js‎

Lines changed: 20 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -266,8 +266,8 @@ function localizeZh(errors) {
266266
}
267267
}
268268

269-
/**
270-
* Created by Liu.Jun on 2020/4/30 11:22.
269+
/**
270+
* Created by Liu.Jun on 2020/4/30 11:22.
271271
*/
272272
var i18n = {
273273
$$currentLocalizeFn: localizeZh,
@@ -8525,6 +8525,9 @@ var Widget = {
85258525
},
85268526
formProps: {
85278527
type: null
8528+
},
8529+
getWidget: {
8530+
type: null
85288531
}
85298532
},
85308533
computed: {
@@ -8553,7 +8556,7 @@ var Widget = {
85538556
// array 渲染为多选框时默认为空数组
85548557
if (this.schema.items) {
85558558
this.value = [];
8556-
} else {
8559+
} else if (this.required) {
85578560
this.value = this.uiProps.enumOptions[0].value;
85588561
}
85598562
}
@@ -8663,7 +8666,14 @@ var Widget = {
86638666
value: this.value // v-model
86648667

86658668
}),
8669+
ref: 'widgetRef',
86668670
on: {
8671+
'hook:mounted': function widgetMounted() {
8672+
// 提供一种特殊的配置 允许直接访问到 widget vm
8673+
if (self.getWidget && typeof self.getWidget === 'function') {
8674+
self.getWidget.call(null, self.$refs.widgetRef);
8675+
}
8676+
},
86678677
input: function input(event) {
86688678
var formatValue = self.formatValue(event); // 默认用户输入变了都是需要更新form数据保持同步，唯一特例 input number
86698679
// 为了兼容 number 小数点后0结尾的数据场景
@@ -11177,8 +11187,8 @@ var OneOfField = {
1117711187
}
1117811188
};
1117911189

11180-
/**
11181-
* Created by Liu.Jun on 2020/4/20 9:55 下午.
11190+
/**
11191+
* Created by Liu.Jun on 2020/4/20 9:55 下午.
1118211192
*/
1118311193

1118411194
var FIELDS_MAPS = {
@@ -11424,7 +11434,8 @@ function getWidgetConfig(_ref6) {
1142411434
fieldClass = uiOptions.fieldClass,
1142511435
emptyValue = uiOptions.emptyValue,
1142611436
width = uiOptions.width,
11427-
uiProps = _objectWithoutProperties(uiOptions, ["widget", "title", "labelWidth", "description", "attrs", "class", "style", "fieldAttrs", "fieldStyle", "fieldClass", "emptyValue", "width"]);
11437+
getWidget = uiOptions.getWidget,
11438+
uiProps = _objectWithoutProperties(uiOptions, ["widget", "title", "labelWidth", "description", "attrs", "class", "style", "fieldAttrs", "fieldStyle", "fieldClass", "emptyValue", "width", "getWidget"]);
1142811439

1142911440
return {
1143011441
widget: widget,
@@ -11439,6 +11450,7 @@ function getWidgetConfig(_ref6) {
1143911450
fieldStyle: fieldStyle,
1144011451
fieldClass: fieldClass,
1144111452
emptyValue: emptyValue,
11453+
getWidget: getWidget,
1144211454
uiProps: uiProps
1144311455
};
1144411456
} // 解析用户配置的 errorSchema options
@@ -11638,8 +11650,8 @@ var formUtils = /*#__PURE__*/Object.freeze({
1163811650
optionsList: optionsList
1163911651
});
1164011652

11641-
/**
11642-
* Created by Liu.Jun on 2020/4/16 10:47 下午.
11653+
/**
11654+
* Created by Liu.Jun on 2020/4/16 10:47 下午.
1164311655
*/
1164411656
var vueProps$1 = {
1164511657
formFooter: {

‎packages/lib/dist/vueJsonSchemaForm.esm.min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/lib/dist/vueJsonSchemaForm.umd.js‎

Lines changed: 20 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -272,8 +272,8 @@
272272
}
273273
}
274274

275-
/**
276-
* Created by Liu.Jun on 2020/4/30 11:22.
275+
/**
276+
* Created by Liu.Jun on 2020/4/30 11:22.
277277
*/
278278
var i18n = {
279279
$$currentLocalizeFn: localizeZh,
@@ -8531,6 +8531,9 @@
85318531
},
85328532
formProps: {
85338533
type: null
8534+
},
8535+
getWidget: {
8536+
type: null
85348537
}
85358538
},
85368539
computed: {
@@ -8559,7 +8562,7 @@
85598562
// array 渲染为多选框时默认为空数组
85608563
if (this.schema.items) {
85618564
this.value = [];
8562-
} else {
8565+
} else if (this.required) {
85638566
this.value = this.uiProps.enumOptions[0].value;
85648567
}
85658568
}
@@ -8669,7 +8672,14 @@
86698672
value: this.value // v-model
86708673

86718674
}),
8675+
ref: 'widgetRef',
86728676
on: {
8677+
'hook:mounted': function widgetMounted() {
8678+
// 提供一种特殊的配置 允许直接访问到 widget vm
8679+
if (self.getWidget && typeof self.getWidget === 'function') {
8680+
self.getWidget.call(null, self.$refs.widgetRef);
8681+
}
8682+
},
86738683
input: function input(event) {
86748684
var formatValue = self.formatValue(event); // 默认用户输入变了都是需要更新form数据保持同步，唯一特例 input number
86758685
// 为了兼容 number 小数点后0结尾的数据场景
@@ -11183,8 +11193,8 @@
1118311193
}
1118411194
};
1118511195

11186-
/**
11187-
* Created by Liu.Jun on 2020/4/20 9:55 下午.
11196+
/**
11197+
* Created by Liu.Jun on 2020/4/20 9:55 下午.
1118811198
*/
1118911199

1119011200
var FIELDS_MAPS = {
@@ -11430,7 +11440,8 @@
1143011440
fieldClass = uiOptions.fieldClass,
1143111441
emptyValue = uiOptions.emptyValue,
1143211442
width = uiOptions.width,
11433-
uiProps = _objectWithoutProperties(uiOptions, ["widget", "title", "labelWidth", "description", "attrs", "class", "style", "fieldAttrs", "fieldStyle", "fieldClass", "emptyValue", "width"]);
11443+
getWidget = uiOptions.getWidget,
11444+
uiProps = _objectWithoutProperties(uiOptions, ["widget", "title", "labelWidth", "description", "attrs", "class", "style", "fieldAttrs", "fieldStyle", "fieldClass", "emptyValue", "width", "getWidget"]);
1143411445

1143511446
return {
1143611447
widget: widget,
@@ -11445,6 +11456,7 @@
1144511456
fieldStyle: fieldStyle,
1144611457
fieldClass: fieldClass,
1144711458
emptyValue: emptyValue,
11459+
getWidget: getWidget,
1144811460
uiProps: uiProps
1144911461
};
1145011462
} // 解析用户配置的 errorSchema options
@@ -11644,8 +11656,8 @@
1164411656
optionsList: optionsList
1164511657
});
1164611658

11647-
/**
11648-
* Created by Liu.Jun on 2020/4/16 10:47 下午.
11659+
/**
11660+
* Created by Liu.Jun on 2020/4/16 10:47 下午.
1164911661
*/
1165011662
var vueProps$1 = {
1165111663
formFooter: {

‎packages/lib/dist/vueJsonSchemaForm.umd.min.js‎

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎packages/lib/src/JsonSchemaForm/common/formUtils.js‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -227,6 +227,7 @@ export function getWidgetConfig({
227227
fieldClass,
228228
emptyValue,
229229
width,
230+
getWidget,
230231
...uiProps
231232
} = uiOptions;
232233

@@ -243,6 +244,7 @@ export function getWidgetConfig({
243244
fieldStyle,
244245
fieldClass,
245246
emptyValue,
247+
getWidget,
246248
uiProps
247249
};
248250
}

‎packages/lib/src/JsonSchemaForm/fieldComponents/Widget.js‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -126,6 +126,9 @@ export default {
126126
},
127127
formProps: {
128128
type: null
129+
},
130+
getWidget: {
131+
type: null
129132
}
130133
},
131134
computed: {
@@ -296,7 +299,14 @@ export default {
296299
...self.uiProps,
297300
value: this.value, // v-model
298301
},
302+
ref: 'widgetRef',
299303
on: {
304+
'hook:mounted': function widgetMounted() {
305+
// 提供一种特殊的配置 允许直接访问到 widget vm
306+
if (self.getWidget && typeof self.getWidget === 'function') {
307+
self.getWidget.call(null, self.$refs.widgetRef);
308+
}
309+
},
300310
input(event) {
301311
const formatValue = self.formatValue(event);
302312
// 默认用户输入变了都是需要更新form数据保持同步，唯一特例 input number

0 commit comments

Comments
 (0)