快捷導(dǎo)航

vue v-for直接循環(huán)數(shù)字實(shí)例

更新時(shí)間：2019年11月07日 09:34:50 作者：老黑

今天小編就為大家分享一篇vue v-for直接循環(huán)數(shù)字實(shí)例，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過來看看吧

vue v-for直接循環(huán)數(shù)字，也就是固定次數(shù)

項(xiàng)目中需要做一個(gè)酒店星級(jí)，酒店星級(jí)就是固定的5星，根據(jù)后臺(tái)返回的數(shù)據(jù)來顯示幾星級(jí)

<!--星級(jí)，循環(huán)固定次數(shù) 5次 根據(jù)酒店等級(jí)顯示亮的星星和灰色的星星-->
<svg class="icon" aria-hidden="true" v-for="index of 5" :key="index">
  <use v-if="index < hotelInfo.level" xlink:href="#ht-icon-xingxing" rel="external nofollow" ></use>
  <use v-else xlink:href="#ht-icon-xingxing1" rel="external nofollow" ></use>
</svg>

以上這篇vue v-for直接循環(huán)數(shù)字實(shí)例就是小編分享給大家的全部內(nèi)容了，希望能給大家一個(gè)參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

Vue動(dòng)態(tài)綁定Class的幾種常用方式
在vue框架開發(fā)中,有時(shí)候我們需要對(duì)元素的樣式進(jìn)行動(dòng)態(tài)控制,比如tab按鈕的切換,下面這篇文章主要給大家介紹了關(guān)于Vue動(dòng)態(tài)綁定Class的幾種常用方式,需要的朋友可以參考下
2023-03-03
Vuex簡單入門
本篇文章主要介紹了初步認(rèn)識(shí)理解Vuex，Vuex就是在一個(gè)項(xiàng)目中，提供唯一的管理數(shù)據(jù)源的倉庫,有興趣的可以了解一下
2017-04-04
vue 使用monaco實(shí)現(xiàn)代碼高亮
這篇文章主要介紹了vue 使用monaco實(shí)現(xiàn)代碼高亮的方法，幫助大家更好的理解和學(xué)習(xí)使用vue框架，感興趣的朋友可以了解下
2021-03-03
vue實(shí)現(xiàn)登錄時(shí)圖形驗(yàn)證碼
這篇文章主要為大家詳細(xì)介紹了vue實(shí)現(xiàn)登錄時(shí)圖形驗(yàn)證碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2022-03-03
Vue使用mockjs問題(返回?cái)?shù)據(jù)、get、post 請(qǐng)求)
這篇文章主要介紹了Vue使用mockjs問題(返回?cái)?shù)據(jù)、get、post 請(qǐng)求)，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。
2023-05-05
Uniapp設(shè)置頁面的背景圖片方法代碼
這篇文章主要給大家介紹了關(guān)于Uniapp設(shè)置頁面的背景圖片,uni-app中設(shè)置背景圖有兩種方式,分別是全局設(shè)置和在相應(yīng)的view內(nèi)設(shè)置背景,文中給出了代碼示例,需要的朋友可以參考下
2024-03-03
vue中如何給data里面的變量增加屬性
這篇文章主要介紹了vue中如何給data里面的變量增加屬性，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2022-03-03
Vue3?中自定義插件的實(shí)現(xiàn)方法
在 Vue 中，一些簡單的功能，我們可以直接定義為全局方法，然后掛到 Vue 上就能使用了，這篇文章主要介紹了Vue3?中自定義插件的實(shí)現(xiàn),需要的朋友可以參考下
2022-08-08
Vue 2.0學(xué)習(xí)筆記之Vue中的computed屬性
本篇文章主要介紹了Vue 2.0學(xué)習(xí)筆記之Vue中的computed屬性，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧
2017-10-10
vue3使用viewer的詳細(xì)用法舉例
viewer.js用于圖片瀏覽的Vue組件,支持旋轉(zhuǎn)、縮放、翻轉(zhuǎn)等操作,這篇文章主要給大家介紹了關(guān)于vue3使用viewer的詳細(xì)用法,文中通過代碼介紹是非常詳細(xì),需要的朋友可以參考下
2023-12-12