diff --git a/src/generators/dom/visitors/Component/Binding.js b/src/generators/dom/visitors/Component/Binding.js index c706e755a4..a689731c87 100644 --- a/src/generators/dom/visitors/Component/Binding.js +++ b/src/generators/dom/visitors/Component/Binding.js @@ -1,6 +1,6 @@ import deindent from '../../../../utils/deindent.js'; import flattenReference from '../../../../utils/flattenReference.js'; -import getSetter from '../shared/binding/getSetter.js'; +import getSetter, { getTailSnippet } from '../shared/binding/getSetter.js'; export default function visitBinding ( generator, block, state, node, attribute, local ) { const { name, keypath } = flattenReference( attribute.value ); @@ -41,6 +41,8 @@ export default function visitBinding ( generator, block, state, node, attribute, const updating = block.getUniqueName( `${local.name}_updating` ); + const initialValue = getInitialValue({ block, local, attribute, name }); + local.create.addBlock( deindent` var ${updating} = false; @@ -51,7 +53,7 @@ export default function visitBinding ( generator, block, state, node, attribute, ${updating} = true; ${setter} ${updating} = false; - }); + }, { init: ${generator.helper( 'differs' )}( ${local.name}.get( '${attribute.name}' ), ${initialValue} ) }); }); ` ); @@ -62,4 +64,19 @@ export default function visitBinding ( generator, block, state, node, attribute, ${updating} = false; } ` ); +} + +function getInitialValue ({ block, local, attribute, name }) { + const tail = attribute.value.type === 'MemberExpression' ? getTailSnippet( attribute.value ) : ''; + + if ( block.contexts.has( name ) ) { + // const prop = dependencies[0]; + + const list = `${local.name}._context.${block.listNames.get( name )}`; + const index = `${local.name}._context.${block.indexNames.get( name )}`; + + return `${list}[${index}]${tail}`; + } + + return `${block.component}.get( '${name}' )${tail}`; } \ No newline at end of file diff --git a/src/generators/dom/visitors/shared/binding/getSetter.js b/src/generators/dom/visitors/shared/binding/getSetter.js index 1e89a4469f..30be314287 100644 --- a/src/generators/dom/visitors/shared/binding/getSetter.js +++ b/src/generators/dom/visitors/shared/binding/getSetter.js @@ -1,6 +1,6 @@ import deindent from '../../../../../utils/deindent.js'; -export default function getSetter ({ generator, block, name, keypath, context, attribute, dependencies, value }) { +export default function getSetter ({ block, name, keypath, context, attribute, dependencies, value }) { if ( block.contexts.has( name ) ) { const prop = dependencies[0]; const tail = attribute.value.type === 'MemberExpression' ? getTailSnippet( attribute.value ) : ''; @@ -8,33 +8,24 @@ export default function getSetter ({ generator, block, name, keypath, context, a return deindent` var list = this.${context}.${block.listNames.get( name )}; var index = this.${context}.${block.indexNames.get( name )}; + list[index]${tail} = ${value}; - if ( ${generator.helper( 'differs' )}( ${value}, list[index]${tail} ) ) { - list[index]${tail} = ${value}; - ${block.component}._set({ ${prop}: ${block.component}.get( '${prop}' ) }); - } + ${block.component}._set({ ${prop}: ${block.component}.get( '${prop}' ) }); `; } if ( attribute.value.type === 'MemberExpression' ) { return deindent` var ${name} = ${block.component}.get( '${name}' ); - if ( ${generator.helper( 'differs' )}( ${value}, ${keypath} ) ) { - ${keypath} = ${value}; - ${block.component}._set({ ${name}: ${name} }); - } + ${keypath} = ${value}; + ${block.component}._set({ ${name}: ${name} }); `; } - return deindent` - var ${name} = ${block.component}.get( '${name}' ); - if ( ${generator.helper( 'differs' )}( ${value}, ${name} ) ) { - ${block.component}._set({ ${name}: ${value} }); - } - `; + return `${block.component}._set({ ${name}: ${value} });`; } -function getTailSnippet ( node ) { +export function getTailSnippet ( node ) { const end = node.end; while ( node.type === 'MemberExpression' ) node = node.object; const start = node.end;