<!--
* @Author: your name
* @Date: 2021-06-24 21:23:13
* @LastEditTime: 2021-06-26 10:54:46
* @LastEditors: Please set LastEditors
* @Description: In User Settings Edit
* @FilePath: \lesson25\01.html
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>vue生命周期学习</title>
<script src="./jquery.js"></script>
<!-- <script src="https://cdn.bootcss.com/vue/2.4.2/vue.js"></script> -->
</head>
<body>
<!-- <div id="app">
<h1>{{message}}</h1>
</div> -->
</body>
<!-- <script>
var vm = new Vue({
el: ‘#app‘,
data: {
message: ‘Vue的生命周期‘
},
beforeCreate: function() {
console.group(‘------beforeCreate创建前状态------‘);
console.log("%c%s", "color:red" , "el : " + this.$el); //undefined
console.log("%c%s", "color:red","data : " + this.$data); //undefined
console.log("%c%s", "color:red","message: " + this.message)
},
created: function() {
console.group(‘------created创建完毕状态------‘);
console.log("%c%s", "color:red","el : " + this.$el); //undefined
console.log("%c%s", "color:red","data : " + this.$data); //已被初始化
console.log("%c%s", "color:red","message: " + this.message); //已被初始化
},
beforeMount: function() {
console.group(‘------beforeMount挂载前状态------‘);
console.log("%c%s", "color:red","el : " + (this.$el)); //已被初始化
console.log(this.$el);
console.log("%c%s", "color:red","data : " + this.$data); //已被初始化
console.log("%c%s", "color:red","message: " + this.message); //已被初始化
},
mounted: function() {
console.group(‘------mounted 挂载结束状态------‘);
console.log("%c%s", "color:red","el : " + this.$el); //已被初始化
console.log(this.$el);
console.log("%c%s", "color:red","data : " + this.$data); //已被初始化
console.log("%c%s", "color:red","message: " + this.message); //已被初始化
},
beforeUpdate: function () {
console.group(‘beforeUpdate 更新前状态===============》‘);
console.log("%c%s", "color:red","el : " + this.$el);
console.log(this.$el);
console.log("%c%s", "color:red","data : " + this.$data);
console.log("%c%s", "color:red","message: " + this.message);
},
updated: function () {
console.group(‘updated 更新完成状态===============》‘);
console.log("%c%s", "color:red","el : " + this.$el);
console.log(this.$el);
console.log("%c%s", "color:red","data : " + this.$data);
console.log("%c%s", "color:red","message: " + this.message);
},
beforeDestroy: function () {
console.group(‘beforeDestroy 销毁前状态===============》‘);
console.log("%c%s", "color:red","el : " + this.$el);
console.log(this.$el);
console.log("%c%s", "color:red","data : " + this.$data);
console.log("%c%s", "color:red","message: " + this.message);
},
destroyed: function () {
console.group(‘destroyed 销毁完成状态===============》‘);
console.log("%c%s", "color:red","el : " + this.$el);
console.log(this.$el);
console.log("%c%s", "color:red","data : " + this.$data);
console.log("%c%s", "color:red","message: " + this.message)
}
})
</script> -->
<!-- <script>
var xhr = new XMLHttpRequest()
xhr.open("get", "./02.txt")
xhr.send();
console.log(xhr.readyState)
xhr.onreadystatechange = function () {
if (xhr.readyState == 4 && xhr.status == 200) {
console.log((xhr.responseText))
}
}
</script> -->
<script>
var temp;
$.ajax({
async: false,
type : "GET",
url : "http://localhost:3456/menuinfo",
cache:false,//强迫当前请求必须访问后台,不能使用客户端的缓存
data:"",//传给后台的数据
dataType : ‘json‘,//将后台返回的内容当作json对象来处理
success : function(data) {
temp=data;
}
});
console.log(temp);
</script>
</html>