小编J W*_*J W的帖子

VueJS:v-bind:样式仅在v-for中有条件地工作

v-bind:style绑定时使用正常工作color:

<p v-bind:style="{ color: '#' + tradingCardOption.BorderColorHex }">
  {{ tradingCardOption.ColorSetName }}
</p>
Run Code Online (Sandbox Code Playgroud)

但是,绑定到background-color不起作用:

v-bind:style="{ background-color: '#' + tradingCardOption.BorderColorHex }" 
Run Code Online (Sandbox Code Playgroud)

也没有绑定到border-top:

v-bind:style="{ border-top: 15px solid + '#' + tradingCardOption.CornerColorHex }"
Run Code Online (Sandbox Code Playgroud)

是什么导致这种条件有条不紊地工作?

<div v-for="tradingCardOption in tradingCardOptions">
  <div v-bind:style="{ background-color: '#' + tradingCardOption.BorderColorHex}" class="color-swatch " v-bind:class="{'selected' : $index == 0}" v-on:click="selectTradingCardOption(tradingCardOption, $event)">
    <div v-bind:style="{ border-top: 15px solid + '#' + tradingCardOption.CornerColorHex}"></div>
  </div> {{ tradingCardOption.BorderColorHex}}
  <p v-bind:style="{ color: '#' + tradingCardOption.BorderColorHex}"> {{ tradingCardOption.ColorSetName }}</p>
</div>
Run Code Online (Sandbox Code Playgroud)

javascript vue.js v-for

4
推荐指数
1
解决办法
1074
查看次数

Vue:限制文本区域输入中的字符,截断过滤器?

<textarea name="" id="" cols="30" rows="10" v-model="$store.state.user.giftMessage | truncate 150"></textarea> 我尝试创建一个自定义过滤器:

filters: {
    truncate(text, stop, clamp) {
        return text.slice(0, stop) + (stop < text.length ? clamp || '...' : '')
    }
}
Run Code Online (Sandbox Code Playgroud)

但是当我将其放入输入的v模型中时,构建并没有中断...

有什么建议吗?

truncate vue.js vuejs2 v-model

2
推荐指数
2
解决办法
2万
查看次数

标签 统计

vue.js ×2

javascript ×1

truncate ×1

v-for ×1

v-model ×1

vuejs2 ×1