vxcontrol/ncform
1
0
Fork 0
mirror of https://github.com/vxcontrol/ncform.git synced 2026-07-19 18:23:32 -04:00
Code Issues Packages Projects Releases Wiki Activity

fix(ncform): fixed field's valueTemplate bug when has init value in list

Browse Source
This commit is contained in:
daniel.xiao
2019-03-11 16:55:35 +08:00
parent 9774f657f4
commit 020995f5d3
3 changed files with 63 additions and 31 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/ncform-e2e/ncform/cypress/integration/examples/valueTemplate.spec.js
+9
View File
@@ -35,4 +35,13 @@ context('ValueTemplate', () => {
})
})
it('Array: Fullname has init value', () => {
let id = md5('Array: Fullname has init value');
cy.get(`[data-cy=${id}]`).within(() => {
cy.get('label').contains('fullname').next().find('input').should('have.value', 'daniel.xiao');
cy.get('label').contains('firstname').next().find('input').clear().type('daniel');
cy.get('label').contains('fullname').next().find('input').should('have.value', 'daniel wang');
})
})
})
packages/ncform/examples/components/vue-ncform/_valueTemplate.html
+50 -29
View File
@@ -4,43 +4,23 @@
<meta charset="UTF-8" />
<title>vue-ncform Example</title>
<link
rel="stylesheet"
href="../../../node_modules/bootstrap/dist/css/bootstrap.min.css"
/>
<link rel="stylesheet" href="../../../node_modules/bootstrap/dist/css/bootstrap.min.css" />
</head>
<body>
<div id="demo" class="container">
<template v-for="item in formSchemas">
<div
:data-cy="item.id"
v-if="mode !== 'only' || item.only"
:key="item.formName"
>
<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"
></ncform>
<ncform :form-schema="item.formSchema" v-model="item.formSchema.value" :form-name="item.formName"></ncform>
<hr />
</div>
</template>
</div>
<script
type="text/javascript"
src="../../../node_modules/vue/dist/vue.js"
></script>
<script
type="text/javascript"
src="https://unpkg.com/blueimp-md5@2.10.0/js/md5.js"
></script>
<script
type="text/javascript"
src="../../../node_modules/@ncform/ncform-common/dist/ncformCommon.min.js"
></script>
<script type="text/javascript" src="../../../node_modules/vue/dist/vue.js"></script>
<script type="text/javascript" src="https://unpkg.com/blueimp-md5@2.10.0/js/md5.js"></script>
<script type="text/javascript" src="../../../node_modules/@ncform/ncform-common/dist/ncformCommon.min.js"></script>
<script type="text/javascript" src="../../../dist/vueNcform.js"></script>
<script type="text/javascript">
Vue.use(vueNcform);
@@ -72,7 +52,7 @@
fullname: {
type: 'string',
valueTemplate: 'dx: {{$root.firstname}} + " " + {{$root.lastname}}'
},
}
}
}
},
@@ -101,7 +81,7 @@
type: 'string',
value: 'daniel.xiao',
valueTemplate: 'dx: {{$root.firstname}} + " " + {{$root.lastname}}'
},
}
}
}
},
@@ -129,7 +109,48 @@
fullname: {
type: 'string',
valueTemplate: 'dx: {{$root.firstname}} + " " + {{$root.lastname}}'
},
}
}
}
},
{
id: md5('Array: Fullname has init value'),
title: 'Array: Fullname has init value',
formName: 'form_' + Math.random(),
formSchema: {
type: 'object',
properties: {
users: {
type: 'array',
items: {
type: 'object',
properties: {
firstname: {
type: 'string',
ui: {
columns: 6
}
},
lastname: {
type: 'string',
ui: {
columns: 6
}
},
fullname: {
type: 'string',
valueTemplate: 'dx: {{$root.users[i].firstname}} + " " + {{$root.users[i].lastname}}'
}
}
},
value: [
{
firstname: 'sarah',
lastname: 'wang',
fullname: 'daniel.xiao'
}
]
}
}
}
}
packages/ncform/src/components/vue-ncform/form-item.vue
+4 -2
View File
@@ -163,9 +163,11 @@ export default {
if (this.$options._init4valueTemplate) { // Prevent init value from being overwritten
if (this.schema.value) result = this.schema.value;
this.$nextTick(() => {
// User nextTick will cause the init value to be incorrect when field item in list
// so here use setTimeout instead
setTimeout(() => {
this.$options._init4valueTemplate = false;
})
}, 100)
}
return result;