router:(router === this.$router)
- 路由配置那一套没有改变,变得是编程式导航的形式:
vue中,往别的路由跳转用的是:
this.$router.push(要跳转的路径)
- 但是vue3中没有了this,所以通过下面的方式代替:
vue3:
import {useRouter} from 'vue-router' //导入useRouter
const router = useRouter() //router === this.$router
router.push(`/detail/${id}`) //使用router.push
在详情页拿到id:(route => this.$route)
import {useRoute} from 'vue-router'//导入useRoute
setup(){
const route = useRoute() //route === this.$route
onMounted(()=>{
console.log(route.params.id) //之前的vue是:this.$route.params.id
})
vuex的用法:store:(store === this.$store)
import {useStore} from 'vuex'
const store = useStore //store === this.$store
store.commit("hide") //之前vue的写法是:this.$store.commit("hide")