fix(ncform): fixed array paths value when changed

fix #162
This commit is contained in:
daniel.xiao
2020-08-12 19:49:07 +08:00
committed by Dmitry Nagibin
parent 72eaaecc28
commit df1cd23f15
2 changed files with 60 additions and 7 deletions
@@ -12,14 +12,17 @@
<template v-for="item in formSchemas">
<div :data-cy="item.id" v-if="mode !== 'only' || item.only" :key="item.formName">
<h4>[CASE] {{ item.title }}</h4>
<ncform :form-schema="item.formSchema" v-model="item.formSchema.value" :form-name="item.formName" @submit="submit(item.formName)" @change="onChange" :is-dirty.sync="item.isFormDirty"></ncform>
<ncform :form-schema="item.formSchema" v-model="item.formSchema.value" :form-name="item.formName"
@submit="submit(item.formName)" @change="onChange" :is-dirty.sync="item.isFormDirty"></ncform>
<button v-if="['v-model: external update', 'reset', 'is-dirty.sync'].indexOf(item.title) >= 0" class="btn btn-primary" @click="changeModel(item.formSchema)">
<button v-if="['v-model: external update', 'reset', 'is-dirty.sync'].indexOf(item.title) >= 0"
class="btn btn-primary" @click="changeModel(item.formSchema)">
Updated Model
</button>
<button v-if="['reset', 'is-dirty.sync'].indexOf(item.title) >= 0" class="btn btn-primary" @click="reset(item.formName)">Reset</button>
<button v-if="['is-dirty.sync'].indexOf(item.title) >= 0" class="btn btn-primary" :disabled="!item.isFormDirty">Submit</button>
<button v-if="['reset', 'is-dirty.sync'].indexOf(item.title) >= 0" class="btn btn-primary"
@click="reset(item.formName)">Reset</button>
<button v-if="['is-dirty.sync'].indexOf(item.title) >= 0" class="btn btn-primary"
:disabled="!item.isFormDirty">Submit</button>
<hr />
</div>
</template>
@@ -125,6 +128,56 @@
}
}
},
{
id: md5('change paths'),
title: 'change paths',
isFormDirty: false,
formName: 'form_' + Math.random(),
formSchema: {
type: 'object',
properties: {
user: {
type: 'object',
properties: {
name: {
type: 'string'
}
}
},
names: {
type: 'array',
items: {
type: 'string',
},
ui: {
widgetConfig: {
showOneIfEmpty: true
}
}
},
users: {
type: 'array',
items: {
type: 'object',
properties: {
firstname: {
type: 'string'
},
lastname: {
type: 'string'
}
}
},
ui: {
widgetConfig: {
showOneIfEmpty: true
}
}
}
}
}
},
]
},
methods: {
@@ -137,7 +190,7 @@
changeModel(formSchema) {
formSchema.value = { user: { name: 'daniel' } };
},
onChange({paths, itemValue, formValue, itemOldValue}) {
onChange({ paths, itemValue, formValue, itemOldValue }) {
console.log('paths:', paths);
console.log('itemValue:', itemValue);
console.log('formValue:', JSON.stringify(formValue, null, 2));
@@ -15,7 +15,7 @@
<component v-else-if="isNormalArrSchema(schema)" :is="'ncform-' + schema.ui.widget" :schema="schema" :paths="paths" v-bind="commonAttrs" class="__ncform-control">
<template v-for="(fieldSchema, fieldName) in (schema.items.properties || {__notObjItem: schema.items})" :slot="fieldName" slot-scope="props">
<form-item :schema="props.schema" :key="`${formName}-${fieldName}`" :form-data="formData" :temp-data="tempData" :global-const="globalConfig.constants" :idx-chain="(idxChain ? idxChain + ',' : '') + props.idx" :global-config="globalConfig" :complete-schema="completeSchema" :paths="paths + '[' + props.idx + ']' + '.' + fieldName" :form-name="formName"></form-item>
<form-item :schema="props.schema" :key="`${formName}-${fieldName}`" :form-data="formData" :temp-data="tempData" :global-const="globalConfig.constants" :idx-chain="(idxChain ? idxChain + ',' : '') + props.idx" :global-config="globalConfig" :complete-schema="completeSchema" :paths="paths + '[' + props.idx + ']' + (fieldName === '__notObjItem' ? '' : `.${fieldName}`)" :form-name="formName"></form-item>
</template>
</component>