mirror/naive-ui
2
0
Fork 0
mirror of https://github.com/tusen-ai/naive-ui.git synced 2025-01-12 12:25:16 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #4 from Infrastructure/feature/form

Browse Source 
Feature/form
This commit is contained in:
jintao-gan 2019-07-30 14:29:19 +08:00 committed by GitHub Enterprise
commit 2e29a95060
2 changed files with 38 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
demo/components/formDemo.vue
View File

@ -281,6 +281,8 @@
ResetForm Method: only can reset the item with prop.<br> ResetForm Method: only can reset the item with prop.<br>
ValidateForm Method: support validate specified items by the second parameter in form of array.<br> ValidateForm Method: support validate specified items by the second parameter in form of array.<br>
</n-form-item> </n-form-item>
<n-popover>
<template v-slot:activator>
<n-form-item <n-form-item
:required-logo="false" :required-logo="false"
prop="input" prop="input"
@ -291,6 +293,9 @@
placeholder="Enter string" placeholder="Enter string"
/> />
</n-form-item> </n-form-item>
</template>
<span>Test nesting formItem in resetForm</span>
</n-popover>
<n-form-item <n-form-item
prop="muti.deep.select" prop="muti.deep.select"
label="Select" label="Select"
@ -734,7 +739,7 @@ export default {
} }
], ],
validateForm: { validateForm: {
input: 'input', input: '',
muti: { muti: {
deep: { deep: {
select: 'Public' select: 'Public'

36
packages/common/Form/src/main.vue
View File

@ -68,30 +68,34 @@ export default {
* @param {Array} scope to specify the scope of validation * @param {Array} scope to specify the scope of validation
* @return {Boolean} validation passed or not * @return {Boolean} validation passed or not
*/ */
validate (cb, scope = []) { validate (cb, scope = [], target = this) {
let promise let promise
let isCallback = typeof cb === 'function' let isCallback = typeof cb === 'function'
if (!isCallback && window.Promise) { if (!isCallback && window.Promise) {
promise = new Promise((resolve, reject) => { promise = new Promise((resolve, reject) => {
cb = valid => valid ? resolve(valid) : reject(valid) cb = (valid) => valid ? resolve(valid) : reject(valid)
}) })
} }
let valid = true let valid = true
let fields = {} let fields = {}
this.$children.forEach((child, i) => { for (let i = 0; i < target.$children.length; i++) {
let child = target.$children[i]
let componentName = child.$options.name
let flag = scope.length > 0 ? scope.indexOf(child.prop) > -1 : true let flag = scope.length > 0 ? scope.indexOf(child.prop) > -1 : true
if (child.prop && flag) { if (componentName === 'NFormItem' && child.prop && flag) {
child.validate('', (errors, field) => { child.validate('', (errors, field) => {
if (errors) { if (errors) {
valid = false valid = false
} }
fields = Object.assign({}, fields, field) fields = Object.assign({}, fields, field)
}) })
} else if (['NFormItem', 'NForm'].indexOf(componentName) === -1) {
this.validate(null, [], child)
} }
if (++i === this.$children.length && isCallback) { if (i === target.$children.length - 1 && isCallback) {
cb(valid, fields) cb(valid, fields)
} }
}) }
if (promise) { if (promise) {
return promise return promise
@ -100,24 +104,28 @@ export default {
/** /**
* just can reset the value with prop in form-item * just can reset the value with prop in form-item
*/ */
resetForm () { resetForm (target = this) {
this.$children.forEach(child => { for (let i = 0; i < target.$children.length; i++) {
if (child.prop) { let child = target.$children[i]
let componentName = child.$options.name
if (componentName === 'NFormItem' && child.prop) {
let keys = child.prop.split('.') let keys = child.prop.split('.')
let obj = this.model let obj = this.model
let j = 0 let j = 0
keys.forEach((k, i) => { keys.forEach((m, n) => {
if (i !== keys.length - 1) { if (n !== keys.length - 1) {
obj = obj[k] obj = obj[m]
} }
j = i j = n
}) })
obj[keys[j]] = getObjValue(this.initialValue, keys) obj[keys[j]] = getObjValue(this.initialValue, keys)
if (child.validateFlag) { if (child.validateFlag) {
child.clearValidateClass() child.clearValidateClass()
} }
} else if (['NFormItem', 'NForm'].indexOf(componentName) === -1) {
this.resetForm(child)
}
} }
})
} }
} }
} }