最近学习AntDesign组件使用,官方Pro例子集成度太高,不容易学习,将从最基础组件一个一个搭建。

1、创建Vue Cli项目

2、引入ant design组件

$ cnpm i --save ant-design-vue

3、安装组件babel-plugin-import

4、修改babelrc文件

cnpm install babel-plugin-import --dev

5、mainjs中引用button组件

6、Vue组件中添加按钮

7、实际效果

AntDesign vue学习笔记(一)初始化项目的更多相关文章

  1. AntDesign vue学习笔记(七)Form 读写与图片上传

    AntDesign Form使用布局相比传统Jquery有点繁琐 (一)先读写一个简单的input为例 <a-form :form="form" layout="v ...

  2. Vue 学习笔记 — 组件初始化

    简书 在vue中有3个概念很容易搞混,data,computed,props,特别是我们这些原后端开发人员. new Vue({ el: "#x", data: { id: 1 } ...

  3. AntDesign vue学习笔记(九)自定义文件上传

    第七节时提到,上传文件时实际可能需要传输一个token. 1.查看vue antdesign文档https://vue.ant.design/components/upload-cn/ 2.使用cus ...

  4. AntDesign vue学习笔记(四)使用组件切换

    同样实现上一篇功能, 改为使用组件切换,实现方法如下 1.修改MainFrm中的<router-view/>如下代码 2.注册局部组件 export default { name: 'Ma ...

  5. AntDesign vue学习笔记(三)嵌套路由使用

    本项目目前结构如下 1.Login页面=>MainFrm页面=>MainFrm左部菜单,右边是显示区域可以切换子页面. 2.当点击左部菜单时,右边的子页面随着进行切换. 实现关键代码如下1 ...

  6. AntDesign vue学习笔记(二)axios使用

    之前在vue页面中引入axios使用,本篇在mainjs中引入,这样就不用单独在每个页面引入 1.mainjs中引入axios,设置基础url import axios from 'axios' ax ...

  7. AntDesign vue学习笔记(八)Table服务端分页使用

    本文是AntDesign后端分页方法 1.设置pagination <a-table :columns="columns" :dataSource="data&qu ...

  8. AntDesign vue学习笔记(六)Table 显示图片

    AntDeign官网上没有table动态绑定显示图片的示例,baidu上搜索出来的大部分都是React语法,无法使用. 经过摸索,实现方法如下:以显示一个图片,一个按钮为例(picurl是返回的jso ...

  9. AntDesign vue学习笔记(五)导航菜单动态加载

    一般的后台系统都有一个树形导航菜单,具体实现如下,主要参考https://my.oschina.net/u/4131669/blog/3048416 "menuList": [ { ...

随机推荐

  1. jq 轮播图 转载-周菜菜

    <style> li{list-style-type:none ; display:inline; width:90px; height:160px; float:left; } .pic ...

  2. go中的事件对象time.Duration

    const ( Nanosecond Duration = 1 Microsecond = 1000 * Nanosecond Millisecond = 1000 * Microsecond Sec ...

  3. 14-网页,网站,微信公众号基础入门(网页版MQTT,小试牛刀)

    https://www.cnblogs.com/yangfengwu/p/11192639.html 抱歉哈...最近由于做板子,,教程的进度落下了... 这些天总共做了还几块板子 首先对当前这个教程 ...

  4. ACM数据结构-单调栈、队列

    1.最大数 代码: #include <stdio.h> #include <memory.h> #include <math.h> #include <st ...

  5. 【JZOJ6232】【20190625】喜欢最最痛

    题目 \(n\)个节点的树,边权为正整数. 从1 号点开始走一个路径并最终回到 1 号点,且这条路径经过了所有的边. 一条路径的代价就是它经过的边的边权之和. 可以加若干条额外边,第 i 条加的额外边 ...

  6. vue中的scoped分析以及在element-UI和vux中的应用

    vue使用了单文件组件方式来解耦视图即.vue后缀文件名 单文件组件组成部分: <template> </template> <script> </scrip ...

  7. 记一次CPU使用100%问题排查

    需求 前端同事说测试环境的服务接口查起来很慢,很不稳定,不是个别接口,而是大量接口. 情况分析 由于是在测试环境联调,没有多少用户量.第一步:先去服务器看看资源的使用情况.使用top命令,查看cpu的 ...

  8. 经典算法(三) 单链表 反转 & 是否相交/成环 & 求交点 等

    参考文章: 判断链表是否相交:http://treemanfm.iteye.com/blog/2044196 一.单链表反转 链表节点 public class Node { private int ...

  9. 第1001次安kali

    第1001次安kali 由于VMware跟win10有仇等原因,最终投入了VirtualBox的怀抱 主要参考这个博客Kali Linux安装教程--VirtualBox 参考Kali安装教程(Vir ...

  10. Vue中使用Sass全局变量

    前言 假设我们原有项目的主题色是蓝色的,这时有个需求,需要把主题色改成橙色的.一般情况下,我们可能会在main.js中引入公共样式文件,但你会发现,在组件中使用公共样式文件中定义的某个参数时,会报一个 ...