vue框架和dropload移動下拉的整合

最近web頁面的開發用到了一個漸進式的javascript框架vue.js,他能夠經過使用簡單的標籤來代替複雜的js拼接代碼。 只須要引入vue.js文件,並在須要傳參的地方加一些特定標籤就能夠是在js中獲取模板了。 在作列表下拉的時候使用了dropload移動下拉框架,經過vue整合把代碼拼接的地方vue標籤替代了。 具體的代碼以下:javascript

首先 咱們須要引入必須的支持文件css

<link href="css/style.css" rel="stylesheet">
	<link href="js/dropload/dropload.css" rel="stylesheet">	
	<script src="js/jquery-1.8.3.min.js"></script>	
	<script src="js/vue.js"></script>
	<script src="js/dropload/dropload.min.js"></script>

其次把須要模板輸出的div 加上vue的標籤: 輸入圖片說明vue

而後在js中聲明vuejava

var listVue = new Vue({
		el : "#sale_list",
		data : {
			list : [],
			page : 1
		}
	});

以後dropload下拉框架中輸出位置listVue.list.push(data[i]);便可; 具體的能夠參考下面的兩個文檔連接 dropload:http://www.jq22.com/jquery-info6960jquery

vue:https://cn.vuejs.org/web

這裏是一個完整的demo https://download.csdn.net/download/wwz_my_sunshine/10475481框架

相關文章
相關標籤/搜索