整個實現過程是用vue實現的,總體來說蠻簡單,如果用jquery實現就會複雜得多。
下面我們來看看vue-devtool裡面的資料:
從資料層面,容易看出,整個下拉資料是來自selectmap
,通過比較selectitemlist
來判斷是否已經選中,選中的選項不顯示。通過求和money
計算出total
.
下面看一下具體實現:
>
選擇款項,並填寫費用h5
>
class
="select-list"
v-for
="(item,index) in selectitemlist"
:key
="index"
>
v-model
="item.id"
placeholder
="選擇款項"
>
v-for
="(val,key) in selectmap"
v-show
="isselect(parseint(key),item.id)"
:value
="parseint(key)"
:key
="key"
:label
="val"
>
el-option
>
el-select
>
placeholder
="請輸入費用"
v-model
="item.money"
type
="number"
class
="money"
>
el-input
>
type
="info"
icon
="el-icon-circle-plus-outline"
circle
@click
="add"
v-show
="selectdata.length > selectitemlist.length"
>
el-button
>
type
="info"
icon
="el-icon-remove-outline"
circle
@click
="reduce(index)"
v-show
="selectitemlist.length > 1"
>
el-button
>
div>
class
="total"
>
元`}}h5
>
需要用到的函式:
//控制選項是否顯示
isselect
(id,currentid)
for(
let i in
this
.selectitemlist)
}return
true
}//新增
add())
}//刪除
reduce
(index)
//求和
total()
})return total
}
vue下拉列表去重
下面是下拉列表 select v model modelid placeholder 模板id option v for item in options 0 key item.modelid label item.modelid value item.modelid option select se...
bootstrap實現多個下拉框同時搜尋的例項
1 第乙個下拉框 請選擇資料資源 selected if if list oelpglomlist as entity selected if if list selected if if list 2 第二個下拉框 selected if list 3 後台js url 引數整理 bindeven...
Oracle如何實現多個欄位去重
我們通常使用distinct關鍵字來去除重覆記錄,還有沒有其他辦法呢?通過查詢資料,確認group by也可以,利用rowid也可以實現功能。其中,group by是用來分組統計的,能用distinct的地方就不要用group by。下面我們看一下幾種方法具體如何實現,至於選用哪一種,主要還是看需求...