<div class="evalutor-item">
<div :id="'service' + index" class="layui-inline">
<span class="layui-inline">評分</span>
<ul class="layui-rate">
<li class="layui-inline" v-for="(item, index) in 5">
<i class="layui-icon" :class="todo.service > index ? 'layui-icon-rate-solid' : 'layui-icon-rate'"></i>
</li>
</ul>
<span class="layui-inline">{{todo.service}}星</span>
</div>
</div>
將以上代碼性置,包含在vue循環(huán)(v-for)中拾并。由于引入了layui.css,所以樣式上會自動進行渲染鹏浅。
這種方式一般使用在前后端不分離的項目中嗅义。