vuejs mixins使用

原創 FLTmiao 2019-06-22 13:12

在項目中，有些時候select下拉選擇框的內容不一定是後端傳的，有時候需要前端寫死，但是很多頁面的下拉框都可能使用到同一個下拉框的內容，自己又不想每個頁面都寫一遍，咋辦？這個時候就需要用到vuejs的mixins混入

首先建立一個js，可以隨意命名

我這裏命名是allList，在裏面寫上用到的下拉框內容

注意：這些內容最好寫在computed裏面，因爲當這裏面的值變換，調用的地方也會跟着變化

在.vue組件中引入

引入進來之後，頁面就可以正常訪問alllist裏面的值啦，多個頁面使用到，多個頁面進行引入就行

這裏用到的是alllist的getNumberList

 

 

發表評論
所有評論
還沒有人評論，想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章

VUEJS項目實踐九之彈框焦點默認在某個按鈕上

一、背景 有一個需求是要彈框後，焦點默認在某個按鈕上，確認或者取消。 二、 我還是用前幾話寫的彈框插件來說，爲了區分焦點在按鈕上還是不在，把之前的css稍微改了一下。文末會附上完整代碼。 1、沒有加這個效果之前 點開彈框，按鈕沒有

Yolanda_NuoNuo 2020-07-05 11:01:45

vue 父子組件傳函數 demo

父組件 <template>  <div>  <Hello :flFlag="myFunction"></Hello>   </div> </template> import Hello from './HelloWorld'

秋水不寒 2020-07-07 08:54:01

Vue性能優化方法

文中例子來自https://www.youtube.com/watch?v=5B66qer8cZo   部分轉載於鏈接：https://www.jianshu.com/p/f372d0e3de80 函數型組件 由於組件的生命週期處理在框架

秋水不寒 2020-07-07 08:54:01

axios 設置header

找了半個互聯網，愣是沒找到一個官方，嚴謹的axios簡寫方式設置headers的文檔，那行，我規範的寫一次吧。 下面介紹官方，家喻戶曉的Request method aliases（簡稱）寫法 Get 格式：axios.get(u

LYJSpeedX 2020-07-07 03:09:29

vue綁定key的案例（輸入框失焦問題）

之前做過這樣的一個需求，就是輸入框可動態增加或者減少的場景。通過v-for來遍歷所有輸入框，那麼分析下面key幾種情況： 爲了演示，這裏假設輸入框的校驗規則是允許字符數爲1-5。 1.沒有綁定key 或者 key綁定index的情

Mount华 2020-07-07 01:57:53

vuejs需要知道的一些知識彙總

      1、vue路由傳值的幾種方法及區別 https://blog.csdn.net/chenzlyan/article/details/83306199 2、Vue的雙向數據綁定   3、vuejs傳值 https://blog

ali是个小太阳 2020-07-06 21:16:37

this dependency was not found

在新版的vue-cli中已經幫我們把sass-loader配置好了，放在了util.js裏面，之前我們還需要去在webpack.base.config.js中去配置相關的設置，現在只需要安裝相應的loader即可。如果還在webp

learning_H 2020-07-05 17:50:45

vue-element-admin執行npm install 報錯解決方法

下載vue-element-admin後，根據官網說明，執行npm install ,報如下錯誤，執行了三次，都是報下面這樣的錯誤： npm ERR! Error while executing: npm ERR! C:\Program

Web魔法师 2020-07-03 18:08:48

Vue:登錄頁面及登錄頁面用到的驗證函數

 登錄頁面： <template> <div id="login"> <div class="login-wrap"> <ul class="menu-tab"> <li v-for="item

Web魔法师 2020-07-03 18:08:48

vue.js 2.x教程

教程 基礎 安裝 兼容性 Vue 不支持 IE8 及以下版本，因爲 Vue 使用了 IE8 無法模擬的 ECMAScript 5 特性。但它支持所有兼容 ECMAScript 5 的瀏覽器。 更新日誌 最新穩定版本：2.5.1

lmjun3 2020-07-03 12:50:50

vue.js入門基礎--慕課網筆記

vue.js入門基礎 第1章 vuejs及相關工具介紹 1-1 vuejs課程簡介及框架簡介 課程簡介 初步瞭解vuejs框架 介紹Vuejs開發環境的搭建和腳手架工具的使用 vuejs具體的指令和項目實踐 準備知識 前端開

lmjun3 2020-07-03 12:50:50

Nginx解決VUE的history模式下刷新404

原配置： location / { root /root/jxiaoshuai-blog-demo/; index index.html index.htm; } 使用try_files解決： lo

叶落森 2020-07-03 10:55:09

轉載：vue+swiper實現輪播效果 一個頁面放多個輪播

原文地址：https://blog.csdn.net/qq_43052274/article/details/90478686

foreverzwl 2020-07-02 21:30:11

VUEJS分頁_刷新當前頁

開發中後端頁面列表時候有時候需要分頁，又需要操作成功後在當前頁籤這時候就麻煩了 開發思路 1 獲取總的數據條數 2 當前分頁每頁顯示的條數 3 計算可分頁多少 ==> 可分頁數量= Math.ceil(總數量 / 每頁數量)

无情小寒 2020-07-02 17:11:34

用vuejs寫一個分頁組件

今天記錄用vuejs2來寫一個分頁組件有些註解定義我說的並不是很準確，主要是方便自己理解寫的，請大家包涵 ...代碼的github網址 : https://github.com/fengliting/vue-page，裏面給了詳細的註解和

FLTmiao 2020-07-02 15:51:09