使用vue开发，需要用到围绕vue.js配套的一系列工具，常用的工具如下：vue.js 核心。VueRouter2 实现路由组织工具。webpack 项目打包以及编译工具。nodejs 前端开发环境。npm 前端包管理器。axios ajax接口请求工具。sass-loader 和 node-sass css 预处理。element 基于 vue 的后台组件库。iview 基于 vue 的另一套后台组件库。vue-cli vue 项目脚手架。一键安装 vue 全家桶的工具。首次使用需要先安装v...
阅读目录一、为什么组件很重要二、Vue里面的组件基础知识1、组件的概念2、组件原理3、组件使用三、封装自己的Component1、使用Component封装bootstrapTable2、封装select3、查看其他Vue框架源码四、总结 正文前言：转眼距离上篇 JS组件系列——又一款MVVM组件：Vue（一：30分钟搞定前端增删改查） 已有好几个月了，今天打算将它捡起来，发现好久不用，Vue相关技术点都生疏不少。经过这几个月的时间，Vue的发展也是异常迅猛，不过这...
vue中的插值，简单来说，就是通过更改script中定义的属性的值，来达到修改html中的值这样一个效果。例如： 我们在div中添加了一个h1标签，看到没有，{{ title }} 这块代码就叫插值。插值的语法是{{}}中加上变量名的形式。这里的title是我们在script的data函数里边定义的title变量，通过插值的方式，就可以方便的更改h1标签中的值。运行效果： 如果我们不想显示HelloWorld，我们可以更改script中的title，比如改成 first vue，看...
vue的版本是：^2.6.10结构如下：|----- vue
| |--- dist # 打包之后的目录vue文件
| | |--- vue.common.dev.js
| | |--- vue.common.js
| | |--- vue.common.prod.js
| | |--- vue.esm.browser.js
| | |--- vue.esm.browser.min.js
| | |--- vue.esm.js
| | |--- vue.js
| | |--- vue.min.js
| | |--- vue.runtime.common.dev.js
| | |--- vue.runtime.common.js
| | |--- vue.rintime.co...
1、Node（后端）中的 MVC 与 前端中的 MVVM 之间的区别MVC 是后端的分层开发概念；MVVM是前端视图层的概念，主要关注于 视图层分离，也就是说：MVVM把前端的视图层，分为了 三部分 Model, View , VM ViewModel为什么有了MVC还要有MVVM<body><!-- 将来 new 的Vue实例，会控制这个 元素中的所有内容 --><!-- Vue 实例所控制的这个元素区域，就是我们的 V --><div id="app"><p>{{ msg }}</p></div><script>// 2. 创建一个Vue的实例//...
1<!DOCTYPE html> 2<html> 3<head> 4<meta charset="UTF-8"> 5<title>常用系统指令</title> 6</head> 7<script src="js/vuejs-2.5.16.js"></script> 8<body> 9 10<!-- 11 完整语法 12 <a v-on:click="doSomething">...</a>13 缩写 14 <a @click="doSomething">...</a>15--> 16 17<!--1.v-on：click--> 18<h4 style="color: blue;text-align:center">1.v-on：click</h1> 19<div id="app1" al...
主要分解为如下步骤：（1）在html文件中引入百度地图，<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=your token "></script>（2）在webpack.base.conf.js文件内添加external选项，在module.exports内部，和entry平级；externals: { "BMap": "BMap" }, （3）添加地图组件BMapComponent.vue，这里主要注意两点： a）使用BMap的时候不需要import了，import反而会报错 b）注意一定要给bma...
学习、使用中结合vue官网的api和教程极佳！前前篇文章上有提及到vue的简单介绍，详情请戳这里 （初试 Vue.js） 第一部分：每个 Vue 应用都是通过 Vue 函数创建一个新的 Vue 实例开始的，比如：var vm = new Vue({// data、el ...
})当你创建一个 Vue 实例时，你将传入一个选项对象；Vue初始化的选项对象包含但不限于el、data、methods、computed、created、filter等等。也就是说，通过以上使用的这些选项对象可以达到你想要的行为...
一、新建VUE页面（VUE动画效果页）
二、配置路由三、主页增加链接代码：<template><div><div ><transition name="fade"><p v-if="show">vue 动画</p></transition></div><button v-on:click="change()">点击效果</button></div>
</template><script>
export default {name: ‘Eoo‘,data () {return {show:false}},methods:{change:function(){this.show = !this.show}}}
</script><style>.title{height: 50px;width: 100px;line-...
第一步：第二步：// vue.config.jsmodule.exports = { configureWebpack: { resolve: { alias: { ‘assets‘: ‘@/assets‘, ‘components‘: ‘@/components‘, ‘views‘: ‘@/views‘, } } },}并且，在没有自行配置alias的时候，就已经可以使用inquire(‘@/xxx’)的方式来引用src/xxx了。也就是@已经被alias成了根目录下的src。 原文：https://www.cnblogs.com/Sweepingmonk/p/108685...
一、计算属性1、模版内的表达式非常便利,但是设计它们的初衷是用于简单计算的。在模版中放入太多的逻辑运算会让模版过重且难以维护,例如如下代码:<div id="example">{{ message.split(‘‘).reverse().join(‘‘) }}
</div>在这个地方,模版不在是简单的声明式逻辑,你必须看一段时间才能意识到,这里是想要显示变量message的翻转字符串,当你想要在模版中多次引用此处的翻转字符串时,就会更加难以处理.所以,任何复杂逻辑，你都应当使用...
router和route区别：1.router是路由对象,里边包含了很多属性和子对象，例如history对象，主要是用来进行路由跳转的1.1路由跳转方式：router-link1.不带参数// 字符串
<router-link to="apple"> to apple</router-link>
// 对象
<router-link :to="{path:‘apple‘}"> to apple</router-link>
// 命名路由
<router-link :to="{name: ‘applename‘}"> to apple</router-link>
// 注意：router-link中链接如果是‘/‘开始就是从根路由...
前言
金三银四快过去了，抓紧这段时间再复习下vue，为了在面试官前突出自己，在回答的时候能带上源码的实现和理解往往更容易成功。这里整理了vue常见的面试题和相应的源码及解读，希望对大家有所帮助。篇幅较长，分为vue2篇和vue3篇。自己整理手写的，有哪里不对或者说的不准确的欢迎指出来，我会虚心接收指教。vue2
1.vue响应式原理
回答这个问题，首先要搞清楚什么叫响应式。通常vue中所说的响应式是指数据响应式，数据变化可以被...
这篇文章主要介绍了vue.js 实现图片本地预览裁剪压缩上传功能,代码简单易懂，非常不错，具有参考借鉴价值，需要的朋友可以参考下以下代码涉及 Vue 2.0 及 ES6 语法。目标纯 javascrpit 实现，兼容ie9及以上浏览器，在本地做好文件格式、长宽、大小的检测，减少浏览器交互。现实是残酷的，为了兼容Ie9 还是用上了 flash，第二篇来解释解释。代码结构<p id="wrap"><label>点我上传图片<input type=file @change="change" ref="input"...
这篇文章主要介绍了Vue2.0系列之过滤器的使用，现在分享给大家，也给大家做个参考。vue2.0已经废弃了过滤器，需要自定义过滤器，用于一些常见的文本格式化。感觉超级好用！！过滤器可以用在两个地方：双花括号插值 和 v-bind表达式。过滤器应该被添加在JavaScript表达式的尾部，由管道符指示。一、注册全局过滤器注意事项：1、全局方法Vue.filter()注册一个自定义过滤器，必须放在vue实例化前面2、过滤器函数始终以表达式的值作为第...
