Merge pull request #391 from F-loat/fix-dynamic-style

fix: #197 修正 style 对象转换后的运算优先级

Author: aOrz

src/platforms/mp/compiler/codegen/babel-plugins.js

@@ -33,7 +33,7 @@ const objectToStringVisitor = {
       const keyStr = getStrByNode(propertyItem.key, true)
       const key = keyStr ? hyphenate(keyStr) : keyStr
       const { code: val } = generate(t.ExpressionStatement(propertyItem.value))
-      return `'${key}:' + ${val.slice(0, -1)} + ';'`
+      return `'${key}:' + (${val.slice(0, -1)}) + ';'`
     }).join('+')
 
     const p = template(expression)({})

test/mp/compiler/index.spec.js

@@ -217,12 +217,17 @@ describe('指令', () => {
   it('v-bind:style', () => {
     assertCodegen(
       `<div v-bind:style="{ color: activeColor, fontSize: fontSize + 'px' }">111</div>`,
-      `<template name="a"><view class="_div" style=" {{('color:' + activeColor + ';' + 'font-size:' + fontSize + 'px' + ';')}}">111</view></template>`,
+      `<template name="a"><view class="_div" style=" {{('color:' + activeColor + ';' + 'font-size:' + (fontSize + 'px') + ';')}}">111</view></template>`,
+      { name: 'a' }
+    )
+    assertCodegen(
+      `<div v-bind:style="{ color: a === b ? activeColor : color, fontSize: fontSize + 'px' }">111</div>`,
+      `<template name="a"><view class="_div" style=" {{(  'color:' +  (a === b ? activeColor : color) +  ';' +  'font-size:' +  (fontSize + 'px') +  ';')}}">111</view></template>`,
       { name: 'a' }
     )
     assertCodegen(
       `<div v-bind:style="[{ color: activeColor, fontSize: fontSize + 'px' }]">111</div>`,
-      `<template name="a"><view class="_div" style=" {{['color:' + activeColor + ';' + 'font-size:' + fontSize + 'px' + ';']}}">111</view></template>`,
+      `<template name="a"><view class="_div" style=" {{['color:' + activeColor + ';' + 'font-size:' + (fontSize + 'px') + ';']}}">111</view></template>`,
       { name: 'a' }
     )
     assertCodegen(