資訊專欄INFORMATION COLUMN
摘要：編寫的移動端條件搜索條組件利用開發的移動端條件搜索條組件，方便在移動端進行多條件下搜索，提高用戶的體驗度，高速提取用戶所要瀏覽的搜索條件，以便提供更精確的用戶瀏覽內容。顯示彈框一級目錄，當時，其值為。
vue-filter-bar
vue編寫的移動端條件搜索條組件
Introduction利用vue開發的移動端條件搜索條組件，方便在移動端進行多條件下搜索，提高用戶的體驗度，高速提取用戶所要瀏覽的搜索條件，以便提供更精確的用戶瀏覽內容。在使用過程中，希望開發者給予更多的建議和批評，使之更加完善，提供更好的服務。Example More Example
cd demoUse Setup Install vue-filter-bar
npm i
npm run dev
npm i vue-filter-bar --saveVue mount
// import
import FilterBar from "vue-filter-bar"
export default {
components: {
FilterBar
}
}
Use in SPA
Data Structure
data.js
Data Paramstop(Number, default: 0): 篩選條離頂部的距離。
name(String, default: ""): 按鈕名稱。
icon(String, default: ""): 按鈕icon (棄用)。
value(String, default: ""): 按鈕的值。
type(String, default: ""): 區分篩選按鈕，當type="filter"時，列表為篩選模式。
showTabHeader(Boolean, default: true): 顯示彈框一級目錄， 當type="filter"時，其值為false。
defaultIcon(String, default: ""): 按鈕默認icon。
selectIcon(String, default: ""): 按鈕被選中icon。
selectIndex(Number, default: 0): 序號，當type="filter"時，其值為-1。
detailList(Array, default:[]): 二級目錄左側列表數據。
list(Array, default: []): 二級目錄右側列表數據。
APIbar-menus(Array, default: []): 按鈕相關數據的入口。
showDialog(Function, return: Object): 顯示按鈕相對應的彈框時調用。
closeDialog(Function, return: Object): 彈框消失時調用。
changeTab(Function, return: Object): 切換彈框一級目錄時調用。
changeMainItem(Function, return: Object): 選擇二級目錄左側列表時調用。
changeSelect(Function, return: Array): 返回最終結果。(注：篩選結果的value返回json對象)
Issues篩選返回數據類型
篩選條件返回的數據是json對象，及下圖中：
對應的value值是對象類型，需使用for in循環去獲取數據。
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/101126.html
摘要：寫在前面沒錯，這就是慕課網上的那個音樂播放器，后臺是某音樂播放器的線上接口扒取，雖然這類項目寫的人很多，但不得不說這還是個少有的適合提升的好項目，做這個項目除了想寫一個比較大并且功能復雜的項目，主要原因是要拿它來應對面試，也確實對我的業務能 寫在前面 沒錯，這就是慕課網上的那個vue音樂播放器，后臺是某音樂播放器的線上接口扒取，雖然這類項目寫的人很多，但不得不說這還是個少有的適合vu...
摘要：基礎布局的中主要為部分，分別是用于搜索篩選和分頁的表單控件用于排序表格的表頭以及用于展示數據的。這也是前瞻發布之后，提出廢棄部分功能后許多人反應較為強烈的原因。 與上周的第一篇實踐教程一樣，在這篇文章中，我將繼續從一種常見的功能——表格入手，展示Vue.js中的一些優雅特性。同時也將對filter功能與computed屬性進行對比，說明各自的適用場景，也為vue2.0版本中即將刪除的部...
摘要：基礎布局的中主要為部分，分別是用于搜索篩選和分頁的表單控件用于排序表格的表頭以及用于展示數據的。這也是前瞻發布之后，提出廢棄部分功能后許多人反應較為強烈的原因。 與上周的第一篇實踐教程一樣，在這篇文章中，我將繼續從一種常見的功能——表格入手，展示Vue.js中的一些優雅特性。同時也將對filter功能與computed屬性進行對比，說明各自的適用場景，也為vue2.0版本中即將刪除的部...
一、 基礎實現 （1）功能 對 better-scroll 插件的基本封裝，實現移動端的滾動 （2）實現 引入 better-scroll props probeType: better-scroll 配置項之一 （1）取值： 1 滾動的時候會派發 scroll 事件，會截流。 2 滾動的時候實時派發 scroll 事件，不會截流。 3 除了實時派發 scroll 事件，在 swipe 的情況...
閱讀 2259·2021-11-22 09:34
閱讀 2033·2021-09-22 15:22
閱讀 2027·2019-08-29 15:05
閱讀 2120·2019-08-26 10:43
閱讀 3418·2019-08-26 10:26
閱讀 896·2019-08-23 18:29
閱讀 3529·2019-08-23 16:42
閱讀 2007·2019-08-23 14:46
