124-143vue

git冲突

合并方案

分支

方便改bug

不建议上传大量文件

nginx

nginx停止： nginx -s -stop
nginx.exe -s -reload开启

vue-3 项目创建

vue3项目改造

</router-link>
<router-link to="/cinemas" custom v-slot="{ navigate, isActive }">
<li @click="navigate" :class="isActive ? 'kerwinactive':''">
<i class="iconfont icon-all"></i>
}
<span>影院</span>
</li>
</router-link>

<script>
export·default {
mounted(){
console.log(this.$route.params.id)
}
}
</script>

export default {
mounted(){
this.$store.commit("hide")
console.log(this.$route.params.id)

},
destroyed(){
this.$store.commit("show")

export default createstore({
state:{
isTabbarShow:true
},
mutations:{
hide(state){
state.isTabbarShow = false
}，
show(state)
state.isTabbarShow = true
}
}
})

vue-reactive

react :
1.类写法
2.函数写法-（不支持状态，，生命周期，支持属性）

// vue3老写法或者vue 写法 中beforeCreeate,created 生命周期=== setup
setup(){
console.log("setup")
//定义状态
const obj = reactive({
myname:"kerwin",
myage:100
})
return {
obj

setup(){
const obj = reactive({
mytext:''
}）
const handleAdd = ()=>{
}
return{
obj,
handleAdd}
}

const obj = reactive({
mytext:'',
datalist:[]
}）
const handleAdd =()=>{
// console.log(obj.mytext)
obj.datalist.push(obj.mytext)
obj.mytext ='
return {
obj,
handleAdd
}

vue- ref

setup(){
const myname = ref("kerwin")
const handleClick =()=>{
}
return {
handleClick,
myname
}

torefs

import {reactive,toRefs} from 'vue'

const obj= reactive({
myname:"kerwin",
myage:100
}）
// console.log()
const handleClick=()=>{
// console.log("111111111")
obj.myname = 'xiaoming'
return {
...toRefs(obj),
handleclick
}

生命周期

计算属性

computed(回调函数）
setup () {
const mytext = ref('')
const computedSum = computed(() => mytext.value.substring(0, 1).toUpperCase() +
mytext.value.substring(1))
//注意mytext.value
return {
mytext,
computedSum
}
}

watch

watch(()=>{
console.log("watch")
},()=>obj.mytext)