vue
关注
分享
扫一扫
阿旺你好啊
这个作者很懒，什么都没留下…
展开
专栏收录文章
- 默认排序
- 最新发布
- 最早发布
- 最多阅读
- 最少阅读
-
Vue请求封装
现在大部分的Vue开发者都使用了axios请求方式新建一个Http.js文件引入axios(需要npm安装到项目中)引入Vue（存储登录信息）import axios from 'axios'import Vue from 'vue'import util from '@/util.js'// 自己定义的工具类axios.defaults.timeout = 5000; //响应时间axios.defaults.headers.post['Content-Type'] = 'appl原创 2020-05-28 10:48:22 · 879 阅读 · 0 评论 -
Vue --获取循环列表的值，并反转文本
v-on:click 添加一个事件监听器v-for=“数组” 绑定数组的数据渲染一个项目列表this.todos[e].text 当前点击事件中，数据项的值reverse 将一个元素的值反转输出 <div id="app"> <ol> <li v-for="(todo,index) in todos" v-on:clic...原创 2020-01-10 09:11:10 · 827 阅读 · 0 评论 -
vue---css作用域
为了防止不同组件间的css样式混乱，在样式文件中添加做作用域关键字 scoped<style scoped>h1, h2 { color: green; font-weight: normal;}</style>原创 2019-08-02 22:09:37 · 108 阅读 · 0 评论 -
vue----cli项目父组件向子组件传值
思路：（1）在父组件中定义数据（2）在父组件中通过v:bind绑定（3）在子组件中通过props接收代码：（1） data() { return { users: [ { name: "mark", position: "web开发", show: false }, { name: "mark", position: "web开发",...原创 2019-08-03 09:58:20 · 593 阅读 · 0 评论 -
vue -----子组件向父组件传值
思路：我这是程序是“从父组件中定义一个title传递给子组件，子组件接收后，在其上添加一个点击事件，通过点击事件传递新值，给父组件中的值”（1）在子组件中的方法中定义 $emit（2）在父组件中接收$emit定义的事件名称（3）在父组件中写入接收方法（1）在子组件中<template> <div class="header"> <h1 v-o...原创 2019-08-03 10:21:29 · 169 阅读 · 0 评论 -
vue基础能力总结
涉及到的知识点bootstrap.css全局过滤器的使用私有过滤器的使用全局键盘码的设定定义全局指令对象数组的添加、删除、查询<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" conten...原创 2019-07-30 20:09:45 · 273 阅读 · 0 评论 -
Vue的生命周期
beforeCreate()Created()beforeMount()Mounted()beforeUpdate()updated()beforeDistory()distoryed()很明显可以看出Vue实例经历了创建、执行、更新、销毁<!DOCTYPE html><html lang="en"><head> <met...原创 2019-07-30 22:03:17 · 240 阅读 · 0 评论 -
安装Vue.js的调试神器---Vue-devtools
vue-devtools是一个专门针对于Vue的一个调试插件。（1）下载地址github https://github.com/vuejs/vue-devtools（2）解压下载的压缩包（3）使用npm命令或cnpm命令安装（推荐使用cnpm安装 npm真的是蜗牛速度）首先需要安装cnpm,通过淘宝镜像 命令 npm install -g cnpm --registry=https:/...原创 2019-08-02 13:32:16 · 198 阅读 · 0 评论 -
Vue概念
遇见Vue.js名词解释：（MVX）（1）MVC:Model(模型)、Controller(控制器)和View(视图) ，用户通过Controller来操作Model以达到View的变化（2）MVP:Presenter()、Controller(控制器)和View(视图),Presenter完全把View和Model进行了分离，其与View没有直接关联，通过定义好的接口进行交互（3）MVV...原创 2019-09-21 10:41:44 · 178 阅读 · 0 评论 -
【一】Vue的第一个脚手架项目 全局组件和局部组件的定义
一个刚配置好的工程文件，首先接触到的是分析工程架构build：针对一些命令的打包配置和工具cnnfig：项目的基本配置、相关测试、生产环境的启动端口、不同的配置有自己不同的配置文件node-modules：有命令 npm i或（cnpm i）自动生成的node使用插件的位置，一般打包或者通过版本控制会忽略src：为开发者编写代码位置（1）assets：存放静态页面和静态...原创 2019-08-02 21:41:41 · 1423 阅读 · 0 评论 -
快速构建第一个Vue.js 使用CLI构建应用
前提已经安装node.js环境，npm也已经完成1.安装vue-clinpm install vue-cli -g2.通过CLI工具初始化一个以Webpack为模板的项目名称为movie_view的项目Vue init webpack movie_view此后会要求用户输入相关的配置项，连续按Enter键即可，生成模板如下（3）生成的项目未经npm安装项目，进入该目录下，使用...原创 2019-08-02 17:45:43 · 136 阅读 · 0 评论 -
计算属性的getter、setter方法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-U...原创 2019-08-02 16:08:37 · 156 阅读 · 0 评论 -
Vue.js的主要特性组件与模板
1.vue.js所关注的核心是MVC模式中的视图层。其组件的作用可以具有很大的复用性，组件是基础HTML元素的拓展，可以方便地自定义其数据和行为。如果想要在所有的页面中都显示一条特定的信息内容，那么就需要注册一个全局组件。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"&g...原创 2019-07-29 14:20:50 · 168 阅读 · 0 评论 -
vue修饰符与事件修饰符
前言在一个控件中使用修饰符 ，可以对控件或操作做出一定的改变或者约束修饰符作用.lazyv-model在input事件秀实况中转变为在change事件中同步.number将用户舒服的值转换为Number类型.trim自动过滤用户输入的首尾空格.stop阻止冒泡.prevent阻止默认行为.capture添加事件侦听器时使用事件...原创 2019-07-29 18:08:27 · 117 阅读 · 0 评论 -
v-model和v-bind绑定数据对比
v-model会忽略所有表单元素的value、checked和selected特性的初始值，vue.js会选择实例数据作为具体的值v-bind不能进行数据的双向绑定，即在网页中可以获取到data的中的值，但不能更改控件上的值实例<!DOCTYPE html><html lang="en"><head> <meta charset="UTF...原创 2019-07-29 20:19:24 · 210 阅读 · 0 评论 -
使用v-model和eval函数实现我的计算器
在实现我的计算器小程序中，需要注意以下几个细节v-model：使用的格式为 v-model=" "。使用等于号在下拉列表中option要写上 value=" "在script中的methods方法中，使用data中的数据，要使用this关键字，否则不能识别eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码。虽然可以简化代码，但不支持多次使用实例，使用sw...原创 2019-07-29 21:00:46 · 566 阅读 · 0 评论 -
vue中使用css美化
动态绑定class,在vue.js中表达式结果的类型出字符串之外，还可以是对象或数组v-bind:classv_bind:style三元表达式class数组样式对象语法格式style数组格式<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> &...原创 2019-07-29 21:50:48 · 1379 阅读 · 0 评论 -
vue中key关键字的使用
解释当使用v-for更新已经渲染过的元素列表时，默认用“就地复用”策略，如果数据项的顺序被改变，Vue.js将不会移动Dom元素来匹配数据项的顺序，就如在数组的尾部和数组的头部插入一个新的元素，所产生的的key值就会不同。为了给Vue.js 追踪每个节点的身份，从而重用或重新排列现有的元素，需要提供一个唯一的Key属性特殊的属性使用v-bind来动态绑定值（全写“ v-bind：key” 简...原创 2019-07-30 09:18:42 · 4245 阅读 · 0 评论 -
v-show与v-if的比较
比较v-if 有更高的切换开销v-show有更高的初始渲染开销如果频繁地切换，使用v-show 如果在运行时条件不会改变，使用v-if<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" conten...原创 2019-07-30 09:41:38 · 128 阅读 · 0 评论 -
methods、computed、watch比较 -----vue
计算属性的声明computed:{}<body> <div id="box"> <p>{{fullname}}</p> <p>{{age}}</p> </div> <script> var vm = new Vue({ ...原创 2019-08-02 15:56:08 · 106 阅读 · 0 评论 -
Vue.js初探
1.创建我的第一个vue.js网页（1）引入vue.js文件下载开发者地址 <script src="../lib/vue.js"></script>输出Hello world<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> ...原创 2019-07-29 11:18:20 · 115 阅读 · 0 评论