vue3写法总结

导入常用组件

  import {ref, onMounted, reactive} from "vue";
  import { useRouter } from "vue-router";

组件引入直接使用

import Carousels from '@/components/carousels/index.vue';

定义复杂双向数据

 import {ref, reactive} from 'vue';
    // 定义跑马灯效果图
    const carousels = reactive([
        'https://t7.baidu.com/it/u=3569419905,626536365&fm=193&f=GIF',
        'https://t7.baidu.com/it/u=1285847167,3193778276&fm=193&f=GIF',
        'https://t7.baidu.com/it/u=4162611394,4275913936&fm=193&f=GIF',
        'https://t7.baidu.com/it/u=3655946603,4193416998&fm=193&f=GIF'
    ])

路由切换

import { useRouter } from "vue-router";
const router = useRouter()
const goToInfo = ()=>{
    router.push('/article/info')
}

你可能感兴趣的:(vue.js,javascript,前端,vue3.0)