页面传参,vm调用数据,父子页面之间的数据调用

2019独角兽企业重金招聘Python工程师标准>>>

页面上调用js里面的方法

@click="click_tag(i)

click_tag  是方法名   卸载method里面

把js里面的数据循环出来

v-for="i in tags

页面上需要用到哪些数据   在data里面定义出来

data: function() {
		return {
			tags: [],
			active_tag: '',
		};
	},

el对应你在页面上的位置   可以是class或id

var vm = new Vue({
	el: '#app',

mui.ready是页面初始化完成时要进行的操作

mui.ready(function() {
	var url = 'http://api.toutiao.axita.com.cn/tags';
	mui.get(url, function(res) {
		vm.tags = res.data.list;
		vm.active_tag = vm.tags[0].code;
	}, 'json');
});

先定义页面上需要的数据

data: function() {
		return {
			code: 'tuijian',
			articles: [],
		};
	},

code要跟一个默认值,在还没有进行任何操作的时候默认显示code里的数据

定义一个拼接字符串的方法,为了请求数据在页面上渲染

methods: {
		load_articles: function() {
			var url = 'http://api.toutiao.axita.com.cn/content/list?tag=' + this.code 
					+ '&min_time=' + (new Date().getTime());
			mui.get(url, function(res) {
				vm.articles = res.data.list;
			}, 'json');
		}
	}

当刚打开app还没有进行任何操作的时候,会进去mui.ready里面进行操作,所以要先调用一次拼接字符串的方法,让默认的第一个数据出来,不能空白

mui.ready(function() {
	vm.load_articles();
	plus.navigator.closeSplashscreen();
});

不同的页面之间关联,一定要有触发点,不要单独存在,一定有关联的方法和事件.  不要忘了关联js和css,路径要正确.

js里面如果加载了mui.init     html里面的style就不用重复定义

转载于:https://my.oschina.net/u/3491770/blog/1477807