vue-绑定内联样式transfrom

像transfrom中有多个属性值的样式，例如：translateX（），如果按照正常的vue写法:style="{color: acticeColor}"的话，vue会报错的，所以寻找了解决方法

原因：vue误以为translateX是一个函数

解决方法：使用模板字符串

<template>
  <div clasa="r-sort" :style="scaleFun"></div> <!--这里注意没有{}，不能写成{sss} -->
</template>
<script>
export default{
  data(){
    return{
       // 移动的距离
      scale: -159,
      // 当前轮播元素
      arrentIndex: 0
    }
  },
  computed: {
    scaleFun() {
      var scale = this.scale
      var arrentIndex = this.arrentIndex
      return `transform:translateX(${scale * arrentIndex + 'px'})`
    }
  }
}
</script>

computed:对于任何复杂逻辑，你都应当使用计算属性。

原文参照：https://www.cnblogs.com/renzm0318/p/9208696.html