Vue
文章平均质量分 60
待我学业归来。
好好学习,天天向上
展开
-
【Vue】12.Element-ui
目录1.简介2.测试2.1创建Vue-cli项目2.2导入npm包管理器2.3测试运行2.4创建文件夹2.5 Login.vue2.6 Main.vue2.7 index.js2.8 main.js2.9 App.vue3.运行 1.简介 element-ui 是饿了么前端出品的基于 Vue.js的 后台组件库,方便程序员进行页面快速布局和构建 官方: http://element-cn.eleme.io/#/zh-CN. 2.测试 2.1创建Vue-cli项目 删除多余的Vue 2.2导入npm包管理器原创 2021-02-20 14:47:48 · 754 阅读 · 0 评论 -
【Vue】11.Vue-cli项目-路由跳转
目录1.创建一个Vue-cli项目2.安装vue-route3.在components 目录下编写组件4.创建route文件夹配置路由5.main.js设置路由6.App.vue使用路由7.运行 1.创建一个Vue-cli项目 使用IDEA打开,把关于Helloworld的Vue删掉。下面控制台运行命令npm run serve查看网页是否是空白。 2.安装vue-route npm install vue-router --save-dev 安装完成查看是否导入到node_modules文件中 3.原创 2021-02-20 13:12:06 · 588 阅读 · 0 评论 -
【Vue】10.webpack学习使用
目录1 .安装Webpack1.1 使用命令提示符安装1.2测试安装是否成功2.实现2.1 创建一个项目2.1.1创建一个文件夹modules2.1.2 编写hello.js(暴露一个方法)2.1.3 编写main.js(接受一个方法)2.1.4 在项目里面创建webpack.config.js2.1.5 命令行输入webpack2.2 刷新项目自动出现打包好的js2.3 创建index.html2.4 运行 1 .安装Webpack WebPack是一款模块加载器兼打包工具(类似Maven),它能把各种资原创 2021-02-19 12:21:33 · 88 阅读 · 0 评论 -
【Vue】9.Vue-cli手脚架项目模板
目录1.安装环境1.1 安装NodeJs1.2 安装vue-cli1.2.1 首先安装Node.js 淘宝镜像加速器1.2.2 安装vue-cli2. 第一个Vue-cli项目2.1新建一个文件 test8-Vue-cli2.2 创建一个基于 webpack 模板的 vue 应用程序 vue-cli 官方提供的一个脚手架,用于快速生成一个 vue 的项目模板 ;预先定义好的目录结构及基础代码,相当于Maven项目,使我们的开发更加的快速。 主要的功能 : 统一的目录结构 本地调试 热部署 单元测试 集成打原创 2020-12-19 18:07:12 · 280 阅读 · 0 评论 -
【Vue】8.自定义事件
在插槽笔记中,删除操作要在组件中完成,那么组件如何才能删除Vue 实例中的数据呢?由于再Vue实例中直接删除,View层界面没有变化,此时就涉及到参数传递与事件分发了 首先再Vue实例中写一个方法removeItems(),然后再View层写一个自定义事件remove,绑定removeItems()方法。此时就可以通过remove自定义事件删除了,于是在组件中写一个按钮绑定remove事件(this.$emit(“remove”)) html <!DOCTYPE html> <html原创 2020-12-19 15:54:58 · 84 阅读 · 0 评论 -
【Vue】7.插槽
在 Vue 中我们使用 元素,作为承载分发内容的出口,可以应用在组合组件的场景中。 html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></scrip原创 2020-12-19 14:58:54 · 88 阅读 · 0 评论 -
【Vue】6.属性计算(类似缓存)
它就是一个能够将计算结果缓存起来的属性(将行为转化成了静态的属性) html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> </head> <body> <div id="app"> <!--注意,一个是方法,一个是属性-->原创 2020-12-19 13:39:40 · 78 阅读 · 0 评论 -
【Vue】5.Axios(异步通信)
1.简介 Axios 是一个开源的可以用在浏览器端和 NodeJS 的异步通信框架,她的主要作用就是实现 AJAX 异步通信,其功能特点如下: 从浏览器中创建 XMLHttpRequests 从 node.js 创建 http 请求 支持 Promise API [ JS中链式编程 ] 拦截请求和响应 转换请求数据和响应数据 取消请求 自动转换 JSON 数据 客户端支持防御 XSRF(跨站请求伪造) 【官方】: http://www.axios-js.com/docs/ 由于 Vue.js 是一原创 2020-12-16 15:11:38 · 134 阅读 · 0 评论 -
【Vue】4.组件
目录1.demo2.使用 props 属性传递参数 组件是可复用的 Vue 实例,说白了就是一组可以重复使用的模板,跟 JSTL 的自定义标签、Thymeleaf 的 th:fragment 等框架有着异曲同工之妙。通常一个应用会以一棵嵌套的组件树的形式来组织: 1.demo html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>T原创 2020-12-16 14:12:40 · 120 阅读 · 0 评论 -
【Vue】3.基本语法
目录1.v-bind2.v-if3.v-for4.v-on(监听事件)5.v-model(双向绑定)5.1 文本框5.2单复选框5.3 多复选框5.4 单选按钮5.5 下拉框 我们对于基础语法,说白了就是实现元素赋值,循环,判断,以及事件响应即可! 1.v-bind html <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title<原创 2020-12-16 13:43:08 · 223 阅读 · 0 评论 -
【Vue】2.第一个Vue程序
目录1.第一个Vue程序 1.第一个Vue程序 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <!--导入vue.js 官方:https://cn- .vuejs.org原创 2020-12-16 11:53:37 · 101 阅读 · 0 评论 -
【Vue】目录(全!!!)
快点下面链接! 1.简介原创 2020-12-15 16:15:47 · 156 阅读 · 0 评论 -
【Vue】1.简介(最简单的介绍)
目录1.前端三要素2.JavaScript框架2.1JQuery库2.2 Angular2.3 React2.4 Vue2.5 Axios3.JavaScript构建工具4.前端人员所需要的后端技术5.UI框架5.1 常用5.2 iView5.3 ElementUI5.4 ICE5.5 VantUI5.6 AtUI5.7 CubeUI5.8 Flutter5.9 Ionic5.10 mpvue6.前后端分离的发展史6.1 后端为主的 MVC 时代6.2 基于 AJAX 带来的 SPA 时代6.3 前端为主的原创 2020-12-15 16:14:49 · 550 阅读 · 0 评论