iview實(shí)現(xiàn)select tree樹(shù)形下拉框的示例代碼
本文介紹了iview實(shí)現(xiàn)select tree樹(shù)形下拉框的示例代碼,分享給大家,具體如下:
html部分
<Tree :data="treeData" ref="tree" :render="renderContent"></Tree>
數(shù)據(jù)部分
export const treeData= [ { title: 'parent 1', expand: true, selected: true, value: '1', children: [ { title: 'parent 1-1', expand: true, value: '11', children: [ { value: '111', title: 'leaf 1-1-1' }, { value: '112', title: 'leaf 1-1-2' } ] }, { title: 'parent 1-2', value: '12', expand: true, children: [ { value: '121', title: 'leaf 1-2-1' }, { value: '122', title: 'leaf 1-2-2' } ] } ] } ];
js部分
// 子節(jié)點(diǎn)的option renderContent (h, { root, node, data }) { return h('Option', { style: { display: 'inline-block', margin: '0' }, props:{ value: data.value } }, data.title); },
以上就是本文的全部?jī)?nèi)容,希望對(duì)大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
相關(guān)文章
vue?cli3配置image-webpack-loader方式
這篇文章主要介紹了vue?cli3配置image-webpack-loader方式,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2022-07-07簡(jiǎn)述Vue中容易被忽視的知識(shí)點(diǎn)
這篇文章主要介紹了簡(jiǎn)述Vue中容易被忽視的知識(shí)點(diǎn),文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2019-12-12前端vue3項(xiàng)目中百度地圖的使用api以及操作實(shí)例
最近項(xiàng)目要用到百度地圖api,好久沒(méi)用到地圖,就百度了一番,但是找了好幾篇文章,發(fā)現(xiàn)都沒(méi)辦法成功實(shí)現(xiàn),現(xiàn)將方法記錄如下,下面這篇文章主要給大家介紹了關(guān)于前端vue3項(xiàng)目中百度地圖的使用api以及操作實(shí)例,需要的朋友可以參考下2023-05-05解決vue-cli-service不是內(nèi)部或外部命令也不是可運(yùn)行的程序或批處理文件的報(bào)錯(cuò)問(wèn)題
這篇文章主要介紹了解決vue-cli-service不是內(nèi)部或外部命令也不是可運(yùn)行的程序或批處理文件的報(bào)錯(cuò)問(wèn)題,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-03-03Vue3?使用v-model實(shí)現(xiàn)父子組件通信的方法(常用在組件封裝規(guī)范中)
這篇文章主要介紹了Vue3?使用v-model實(shí)現(xiàn)父子組件通信(常用在組件封裝規(guī)范中)的方法,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì),感興趣的朋友跟隨小編一起看看吧2024-06-06Vue render渲染時(shí)間戳轉(zhuǎn)時(shí)間,時(shí)間轉(zhuǎn)時(shí)間戳及渲染進(jìn)度條效果
這篇文章主要介紹了Vue render渲染時(shí)間戳轉(zhuǎn)時(shí)間,時(shí)間轉(zhuǎn)時(shí)間戳及渲染進(jìn)度條效果,通過(guò)實(shí)例代碼相結(jié)合的形式給大家介紹的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2018-07-07vue進(jìn)行圖片的預(yù)加載watch用法實(shí)例講解
下面小編就為大家分享一篇vue進(jìn)行圖片的預(yù)加載watch用法實(shí)例講解,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2018-02-02Vue3+El-Plus實(shí)現(xiàn)表格行拖拽功能完整代碼
在vue3+elementPlus網(wǎng)站開(kāi)發(fā)中,詳細(xì)完成el-table表格的鼠標(biāo)拖拽/拖曳/拖動(dòng)排序,下面這篇文章主要給大家介紹了關(guān)于Vue3+El-Plus實(shí)現(xiàn)表格行拖拽功能的相關(guān)資料,需要的朋友可以參考下2024-05-05解決在vue的mounted中獲取對(duì)象為null問(wèn)題
這篇文章主要介紹了解決在vue的mounted中獲取對(duì)象為null問(wèn)題,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-03-03詳解搭建一個(gè)vue-cli的移動(dòng)端H5開(kāi)發(fā)模板
這篇文章主要介紹了詳解搭建一個(gè)vue-cli的移動(dòng)端H5開(kāi)發(fā)模板,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2020-01-01