vue 直接使用

发布于:2020-12-21 07:26:25

<script src="https://cdn.jsdelivr.net/npm/vue@2.6.11"></script>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>


html

<div id="app">
<div class="page page1" v-show="page==1">
<div v-bind:class="{active}" @click="change()">点击</div>
</div>
<div class="page page1" v-show="page==2"></div>
<div class="page page1" v-show="page==3"></div>
</div>


js

var app = new Vue({
			el: '#app',
			data: {
				loading:true,
				start:1,
				page: 1, 
				play:true,
				active: false
			},
			 created: function () {					
				   var _this = this;
					axios.post('api.php?m=go')
					.then(function (res) {
					  console.log(res);
					  if(res.data.code==1){
						  _this.page = 6
					  }else if(res.data.code==2){
						  _this.page = 3
					  }
					})
					.catch(function (error) {
					  console.log(error);
					}); 
					
					setTimeout(() => {
						_this.loading = false;
					}, 1000)
			},
			// 方法
			methods: {
				// 点击事件
				change: function () {
					this.active = true;
					var _this = this;
					axios.post('api.php?m=go&kai=1')
					.then(function (res) {
					  console.log(res);
					  if(res.data.start==0){
						  _this.page = 6
					  }
					  else{
						  _this.start = res.data.start
						  _this.zjid = res.data.zjid
						  setTimeout(() => {
						  	_this.page = 3
						  }, 2000)
					  }
					})
					
				}
			}
			
		})


觉得有用请点个赞吧!
0 509