vue项目中使用ant-design-vue中a-tabel组件 Vue.js

1，首先安装ant-design-vue：yarn add ant-design-vue
2，在main.js中引入：
import Antd from 'ant-design-vue'
import 'ant-design-vue/dist/antd.css'
Vue.use(Antd)
3，App.vue页面

.v-enter{ // v-enter：定义进入过渡的开始状态。元素被插入之前生效，在元素被插入之后的下一帧移除 transition: all .5s ease; transform: translateX(100%); } .v-leave-to{ // v-leave-to: 2.1.8版及以上定义离开过渡的结束状态 transition: all .5s ease; opacity: 0; transform: translateX(-100%); position:absolute; } .v-leave-active,.v-enter-active{ // v-enter-active：定义进入过渡生效时的状态 // v-leave-active：定义离开过渡生效时的状态 transition: all .5s ease; } #app { font-family: 'Avenir', Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: center; color: #2c3e50; overflow-x: hidden; margin:0; } #nav { padding: 30px; a { font-weight: bold; color: #2c3e50; &.router-link-exact-active { color: #42b983; } } }

HelloWord.vue:

router.js：

import Vue from 'vue' import VueRouter from 'vue-router' import Home from '../views/Home.vue'Vue.use(VueRouter)const routes = [ { path: '/', name: 'Home', component: Home }, { path: '/about', name: 'About', component: () => import(/* webpackChunkName: "about" */ '../views/About.vue') } ]const router = new VueRouter({ routes })export default router

【vue项目中使用ant-design-vue中a-tabel组件】