安装

1. 确定电脑已装node和npm

出现版本号则说明电脑已经安装好node和npm
2. 创建一个基于webpack的项目

 

3. 在项目里安装依赖

4. 运行

配置路由
为了动态渲染各个页面的组件，这个是必须的，这些都在router文件夹里的index.js配置好，在components文件夹在下面新建index.vue
 1. 导入页面

 2. 配置全局路径

Element-UI
使用element-ui编写页面样式，具体操作参照官网
 1. 安装

 2. 全局配置
找到main.js文件,引入官网提供的样式

页面

参考element-ui官网做出一些假数据写出index页

绑定table数据

 1. 安装并全局导入axios（导入方式看官网）

axios 并不属于 vue的插件
框架与Http本身没有必然的归属性关系，是要实现了Http标准，都可以在任意框架中使用
想要使用this调用的话，可以绑定到vue.prototype上

 2. 获取接口，绑定数据

新增日志数据【知识点：父子组件的传值】
 1. 新建新增日志组件edit,并且在父组件里调用，edit页面内容forms快捷键自动生成
非空验证（详情看elementUi form表单验证） 

 3.点添加，显示弹窗。

 4. 在子组件里method里写新增方法submit()

新增事件：submit,取消事件：cancel-dialog一起传到父组件，在父组件里写方法操作

【vue入门】日志demo，增删改查的练习（无vuex版本）的更多相关文章

  1. vue实战(一):利用vue与ajax实现增删改查

    vue实战(一):利用vue与ajax实现增删改查: <%@ page pageEncoding="UTF-8" language="java" %> ...

  2. java springboot整合zookeeper入门教程（增删改查）

    java springboot整合zookeeper增删改查入门教程 zookeeper的安装与集群搭建参考:https://www.cnblogs.com/zwcry/p/10272506.html ...

  3. vue实现数据的增删改查

    在管理员的一些后台页面里,个人中心里的数据列表里,都会有对这些数据进行增删改查的操作.比如在管理员后台的用户列表里,我们可以录入新用户的信息,也可以对既有的用户信息进行修改.在vue中,我们更应该专注 ...

  4. Hibernate入门案例及增删改查

    一.Hibernate入门案例剖析: ①创建实体类Student 并重写toString方法 public class Student { private Integer sid; private I ...

  5. Zookeeper demo增删改查

    Zookeeper 的增删改查demo代码 public class SimpleZkClient { private static final String connectString = &quo ...

  6. vue+express+mongodb 实现 增删改查

    一.创建一个vue项目 用脚手架vue-cli搭建一个项目,数据请求用axios方式,写几个按钮用来调接口(vue这块不做多解释,不懂的可以先去官网学习vue-cli:https://cli.vuej ...

  7. 【Mybatis】mybatis开启Log4j日志、增删改查操作

    Mybatis日志(最常用的Log4j) 官方网站http://www.mybatis.org/mybatis-3/zh/logging.html 1.在src目录下创建一个log4j.propert ...

  8. Series 入门(创建和增删改查)

    Series 是pandas两大数据结构中(DataFrame,Series)的一种.使用pandas 前需要将pandas 模块引入,因为Series和DataFrame用的次数非常多,所以将其引入 ...

  9. MVC 入门 自动生成 增删改查所有功能

    MVC现在版本已经是5了   EF现在最新的应该是6.0.2了 开发工具是 Visual Studio2013 数据库是 SQL Server 2012 这些需要.NET Framework4.5 的 ...

  10. MyBatis入门案例、增删改查

    一.MyBatis入门案例: ①:引入jar包 ②:创建实体类 Dept,并进行封装 ③ 在Src下创建大配置mybatis-config.xml <?xml version="1.0 ...

随机推荐

  1. (Lua) C++ 加入 Lua 環境擴充應用強度

    Lua 在網上有非常多的介紹,就是一個小而巧的語言,可以放入嵌入式系統 也可以在一般的應用上非常強大,這邊主要記錄如何讓Lua加入C++裡頭應用 Lua source code 是以 C 語言下去編寫 ...

  2. UI1

    计算机工程系     目 录   实验一 Photoshop基本界面熟悉 3 实验二 PhotoShop常用工具的使用 4 实验三 图象和图层的处理 7 实验四 各种滤镜方式的处理 13 实验五 Ph ...

  3. 安装CentOS 7.4时服务器出现No Caching mode page found问题的解决方法

    2019-03-27 前提准备条件: 操作系统:centos 7.4:服务器使用U盘安装,U盘使用UltraISO制作启动盘 安装过程出现的问题: [sdb] No Caching mode page ...

  4. spring boot快速入门 2 ：属性配置

    属性配置:在application.properties中配置 第一步:配置端口号和项目名 并启动 第二步:在浏览器查看请求 第二种配置方式: 在application.yml中配置.(较为常用) 注 ...

  5. redis的 list

    redis的list是一个双向链表,既可以用作栈,也可以用作队列,幸好大学学过数据结构,还有印象. 栈:先进后出,队列:先进先出 redis链表操作: 应用场景学习list链表:要获取最新的10个登录 ...

  6. c++ 网络编程课设入门超详细教程 ---目录

    原文作者:aircraft 原文链接:https://www.cnblogs.com/DOMLX/p/9663167.html c++ 网络编程(一)TCP/UDP windows/linux 下入门 ...

  7. js 页面间的通信

    看了一下公司原来的代码,原页面ajax post返回一个页面完整的HTML,然后再打开一个新页面并输出ajax返回的所有代码到新页面上,在新页面上以表单提交的形式实现重定向. 任凭我想了半天也没想出来 ...

  8. 请别再拿“String s = new String("xyz");创建了多少个String实例”来面试了吧---转

    http://www.iteye.com/topic/774673 羞愧呀,不知道多少人干过,我也干过,面壁去! 这帖是用来回复高级语言虚拟机圈子里的一个问题,一道Java笔试题的. 本来因为见得太多 ...

  9. JavaScript es6 class类的理解。

    本着互联网的分享精神,在本篇文章我将会把我对JavaScript  es6 class类的理解分享给大家. JavaScript 类主要是 JavaScript 现有的基于原型的继承的语法糖. 类语法 ...

  10. Varint数值压缩算法

    Varint 是一种紧凑的表示数字的方法.它用一个或多个字节来表示一个数字,值越小的数字使用越少的字节数.这能减少用来表示数字的字节数.比如对于 int32 类型的数字,一般需要 4 个 byte 来 ...