◆VueJs与NodeJs学习
日出东方VS唯我不败
这个作者很懒,什么都没留下…
展开
-
vuejs项目运行的探索之路
初次尝试学习vue.js的探索之路非常感谢该博客主人提供的例子vueadmin(http://www.cnblogs.com/taylorchen/p/6083099.html)1、先安装nodejs环境2、进入到项目vueAdmin-master目录下执行npm install下载依赖国内被墙,报错,然后网上查询可以设置代理,用cnpm,果断尝试一下,执行下述命令npm ...转载 2017-04-11 16:17:48 · 706 阅读 · 0 评论 -
前端框架Vue.js的使用及具体页面跳转时的参数传递
由于项目急且前端开发人员只会拼页面具体数据交互不会,只能我后台开发人员来写。因为是数据交互使用的是ajax方式,我首先要面临的问题是我获得的数据怎么显示在页面上,以及怎么把数据保存下来,等页面跳转时就不用向后台再次请求数据,比如用户名以帐号相关基础信息,不可能每次打开新页面都向后台请求一下,太麻烦且交互数据太多。我首先想到的是H5里的LocalStorage,SessionStroage保转载 2017-05-15 13:32:49 · 2912 阅读 · 0 评论 -
vue学习之mintui picker选择器实现省市二级联动
picker选择器介绍:https://mint-ui.github.io/docs/#/zh-cn2/picker代码如下: 头像原创 2017-04-24 19:43:47 · 26737 阅读 · 2 评论 -
Vue开发中的常见问题
最近在群里看到在大家在学习vue的过程中,遇到的很多问题都十分的类似,这里做一下总结:####eslint静态检查在大家用vue-cli创建工程的时候,会有一项,使用使用eslint,如果选择了y,那么工程就会安装并启用eslint。这里列举一下常见的错误:1.多余的分号2.定义了却未使用的变量3.结尾多余空格4.超过一行的空行5.代转载 2017-05-17 19:50:08 · 1909 阅读 · 0 评论 -
Vue生命周期
github地址:https://github.com/manlili/vue_learn里面的lesson03一 vue的生命周期如下图所示(很清晰) 二 vue生命周期的栗子 注意触发vue的created事件以后,this便指向vue实例,这点很重要DOCTYPE html>html> head> me转载 2017-04-27 10:14:48 · 406 阅读 · 0 评论 -
vuejs几种不同组件(页面)间传值的方式
在应用复杂时,推荐使用vue官网推荐的vuex,以下讨论简单SPA中的组件间传值。一、路由传值 路由对象如下图所示: 在跳转页面的时候,在js代码中的操作如下,在标签中使用标签123456this.$router.push({转载 2017-04-27 10:49:34 · 52347 阅读 · 1 评论 -
VUE2.0不可忽视的很多变化
今天使用webpack-sample初始一个vue-cli项目,在app.vue文件中添加了个钩子函数ready,可是ready内的事件一直不执行,检查了webpack文件和package.json也没发现什么问题,浏览器也没报错或者提示,很令人捉急。然后去github看了webpack-simple源码,才发现原来vue init webpack-simple默认安装的vue是2.0版本。马上推转载 2017-04-27 16:29:27 · 425 阅读 · 0 评论 -
Vue数据绑定
gitHub地址:https://github.com/manlili/vue_learn里面lesson04 一 双括号用来数据绑定(1)写法一: {{message}},这种可以实时响应(2)写法二: {{*message}},单次插值,今后的数据变化就不会再引起插值更新了(3)双括号标签也可以用在属性上举个栗子:DOCTYPE ht转载 2017-04-27 15:13:56 · 2718 阅读 · 0 评论 -
VUE进阶(路由等)
vue2.0+elementUI构建单页面后台管理平台: http://www.cnblogs.com/dmcl/p/6722315.html初级教程:http://www.cnblogs.com/dmcl/p/6137469.htmlVUE进阶自定义指令http://cn.vuejs.org/v2/guide/custom-directive.html#简介//转载 2017-04-27 16:44:14 · 1168 阅读 · 0 评论 -
初学VUE2.0
vue2.0+elementUI构建单页面后台管理平台: http://www.cnblogs.com/dmcl/p/6722315.html 初学VUE2.0(个人笔记,写完后发现好乱....下期使用markdown书写。)概述webstorm添加对VUE的支持 http://www.jianshu.com/p/142dae4f8b51推荐拓展:vue的c转载 2017-04-27 16:39:20 · 816 阅读 · 0 评论 -
vue项目使用手机浏览器访问时报错:Uncaught TypeError: Object.assign is not a function
原因:Babel默认只转换新的JavaScript句法(syntax),而不转换新的API,比如Iterator、Generator、Set、Maps、Proxy、Reflect、Symbol、Promise等全局对象,以及一些定义在全局对象上的方法(比如Object.assign)都不会转码。举例来说,ES6在Array对象上新增了Array.from方法。Babel就不会转码这个方法。如果...原创 2017-06-02 19:32:01 · 9008 阅读 · 2 评论 -
Vue.js系列之vue-resource
一.vue-resource特点vue-resource插件具有以下特点:1. 体积小vue-resource非常小巧,在压缩以后只有大约12KB,服务端启用gzip压缩后只有4.5KB大小,这远比jQuery的体积要小得多。2. 支持主流的浏览器和Vue.js一样,vue-resource除了不支持IE 9以下的浏览器,其他主流的浏览器都支持。3.转载 2017-06-13 11:40:37 · 5000 阅读 · 0 评论 -
vue2移动端上传,预览,压缩图片,解决拍照旋转问题
因为最近遇到个移动端上传头像的需求,上传到后台的数据是base64位,其中为了提高用户体验,把比较大的图片用canvas进行压缩之后再进行上传。在移动端调用拍照功能时,会发生图片旋转,为了解决这个问题引入了exif去判断拍照时的信息再去处理图片,这是个很好的插件。关于exif.js可以去他的GitHub上了解,这边直接npm install exif-js --save 安装,然后impo转载 2017-07-14 16:56:51 · 5286 阅读 · 2 评论 -
如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件
使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要修改的是build/webpack.base.conf.js,修改两处的代码// 在开头引入webpack,后面的plugins那里需要var webpack = require('webpack')// resolvemodule.exports = { // 其他代码... res转载 2017-07-24 15:57:37 · 1087 阅读 · 0 评论 -
vue学习笔记(一)关于事件冒泡和键盘事件 以及与Angular的区别
一、事件冒泡方法一、使用event.cancelBubble = true来组织冒泡 methods:{ show1:function(ev){ console.log(ev); alert(1); ev.cancelBubble=true; /*阻止冒转载 2017-05-23 11:35:32 · 3977 阅读 · 0 评论 -
Vue2中的键盘事件
Vue2键盘事件:keydown/keyup...1.使用 window.onload = function(){ var vm = new Vue({ el:'#box', methods:{ s转载 2017-04-24 14:35:57 · 45524 阅读 · 1 评论 -
v-bind和v-on
v-bind指令用于设置HTML属性:v-bind:href 缩写为 :hrefaa v-on 指令用于绑定HTML事件 :v-on:click 缩写为 @click aa最好不要用@,因为asp.net mvc页面识别@ 不太好 aa转载 2017-05-13 11:55:29 · 6540 阅读 · 0 评论 -
(vue.js)vue 父组件使用keep-alive和infinite-scroll导致在子组件触发父组件的infinite-scroll方法
关于网友提出的“ (vue.js)vue 父组件使用keep-alive和infinite-scroll导致在子组件触发父组件的infinite-scroll方法”问题疑问,本网通过在网上对“ (vue.js)vue 父组件使用keep-alive和infinite-scroll导致在子组件触发父组件的infinite-scroll方法”有关的相关答案进行了整理,供用户进行参考,详细问题解答如转载 2017-05-04 19:40:31 · 3515 阅读 · 0 评论 -
命令行生成vue项目框架
安装nodejs用命令行生成vue项目框架需要npm包管理器来安装,而npm又是在安装nodejs的时候同时安装的,所以首先要安装nodejs,学习vue有必要了解下nodejs和npm的基本知识:nodejs安装: http://blog.csdn.net/zzwwjjdj1/article/details/51980082npm 介绍: http://blog.csdn.n转载 2017-04-11 17:14:22 · 1212 阅读 · 0 评论 -
如何在本地进行微信公众号的开发和调试
意外金喜的博客 : http://blog.csdn.net/zzwwjjdj1开发微信公众号大家都知道需要外网域名才能收到微信服务器推送的内容,这给开发带来了极大的不便,不过现在好了.QQ浏览器自带开发者工具:微信调试工具,安装好QQ浏览器后:-- 搜索点击加号出现这个界面,再点击开发者工具,如果你没有安装微信调试工具就能看到这个插件的图标,转载 2017-04-11 17:21:46 · 3691 阅读 · 0 评论 -
vue组件化开发初体验-示例vue-loader-example学习记录
目录结构- demo/ + package.json //npm配置文件 + webpack.config.js //webpack配置 + index.html //页面 - node_modules //npm加载的模块 - src //开发资源目录 - assets //一些资源 + logo.png //图片资源 - component转载 2017-04-11 18:10:17 · 443 阅读 · 0 评论 -
Vue组件模板注意事项
驼峰式命名时要注意的事项: 在 table 的 tr 元素中放置了一个 my-component 自定义元素,props 中 propA 在 HTML 代码中必须写成 prop-a,注意 js 中所有驼峰式命名属性在 HTML 中均须写成小写字母短横分隔的形式原创 2017-04-14 10:04:13 · 1757 阅读 · 0 评论 -
Vue开发中的常见问题
原文链接: https://segmentfault.com/a/1190000005034270最近在群里看到在大家在学习vue的过程中,遇到的很多问题都十分的类似,这里做一下总结:eslint静态检查在大家用vue-cli创建工程的时候,会有一项,使用使用eslint,如果选择了y,那么工程就会安装并启用eslint。这里列举一下常见的错误:1.多余转载 2017-04-14 10:07:05 · 2282 阅读 · 0 评论 -
vue 使用总结
1.Vuejs组件vuejs构建组件使用Vue.component('componentName',{ /*component*/ });这里注意一点,组件要先注册再使用,也就是说:Vue.component('mine',{ template:'#mineTpl', props:['name','title','city','c转载 2017-04-18 17:05:25 · 1257 阅读 · 0 评论 -
vue2.0父子组件以及非父子组件如何通信
1.父组件传递数据给子组件父组件数据如何传递给子组件呢?可以通过props属性来实现父组件:parent> child :child-msg="msg">/child>//这里必须要用 - 代替驼峰/parent>data(){ return { msg: [1,2,3] };}123456789123456789子组件通转载 2017-04-18 17:07:43 · 408 阅读 · 0 评论 -
Vue.js项目中,当图片无法显示时则显示默认图片
最近在学习Vue时,遇到了一个问题,就是从后台传过来的图片路径无效时,需要在页面显示默认图片本人试了3种方法,2种方法失败了失败方法一:见http://blog.csdn.net/qq_32786873/article/details/53483951失败方法二:直接把图片路径直接写在data里面作为变量传到模板中,但是却发现图片还是出不了,以为是图片路径的问题,查了半天才发现项目启动后图片的路径...原创 2017-04-13 19:57:54 · 29841 阅读 · 4 评论 -
Vue 开源项目库汇总
来自:GitHub - opendigghttps://github.com/opendigg/awesome-github-vue如有好文章投稿,请点击 → 这里了解详情最近做了一个Vue开源项目库汇总,里面集合了OpenDigg 上的优质的Vue开源项目库,方便移动开发人员便捷的找到自己需要的项目工具等,感兴趣的可以到GitHub上给个star。ht转载 2017-04-21 09:42:28 · 1127 阅读 · 0 评论 -
Vue系列:如何将百度地图包装成Vue的组件
(1)在index.html文件中引入百度地图,(2)在webpack.base.conf.js文件内添加external选项,在module.exports内部,和entry平级;externals: { "BMap": "BMap" }, (3)添加地图组件BMapComponent.vue,这里主要注意两点: a)使用BMap的时原创 2017-04-21 16:08:05 · 14469 阅读 · 3 评论 -
教你在微信中给Vue单页应用设置标题
前言由于Vue React Angular等框架出来的应用都是SPA(single-page-application),所以就没有所谓的页面 都是router而网页的标题 随着路由的改变而改变 也就成了一个(伪)需求问题在iOS的微信中 一个SPA应用 想要改变微信顶部导航栏的标题 使用document.title = xxx来改变网页标题是无效的原因大致就转载 2017-05-04 13:24:01 · 8119 阅读 · 0 评论 -
npm 项目更换目录后无法启动
问题描述:使用 Vue-cli 创建的项目,当文件移动到其他目录后,无法正常启动,报错信息如下: 分析原因:npm 项目,在安装依赖(node_modules)的时候,会记录当前的文件路径。当路径更改,就无法正常启动。 解决方案:文件移动之后,删除 node_modules 文件夹,然后执行 npm install,即可正常启动项目转载 2017-05-04 15:20:44 · 2295 阅读 · 1 评论 -
Vue2.0 探索之路——生命周期和钩子函数的一些理解
前言在使用vue一个多礼拜后,感觉现在还停留在初级阶段,虽然知道怎么和后端做数据交互,但是对于mounted这个挂载还不是很清楚的。放大之,对vue的生命周期不甚了解。只知道简单的使用,而不知道为什么,这对后面的踩坑是相当不利的。因为我们有时候会在几个钩子函数里做一些事情,什么时候做,在哪个函数里做,我们不清楚。于是我开始先去搜索,发现vue2.0的生命周期没啥文章。大多是转载 2017-05-04 15:57:26 · 1461 阅读 · 0 评论 -
Vue入门系列之Vue实例详解与生命周期
Vue的实例是Vue框架的入口,其实也就是前端的ViewModel,它包含了页面中的业务逻辑处理、数据模型等,当然它也有自己的一系列的生命周期的事件钩子,辅助我们进行对整个Vue实例生成、编译、挂着、销毁等过程进行js控制。5.1. Vue实例初始化的选项配置对象详解前面我们已经用了很多次 new Vue({...})的代码,而且Vue初始化的选项都已经用了data、methods转载 2017-05-04 16:00:43 · 656 阅读 · 0 评论 -
Vue路由开启keep-alive时的注意点
这个不是业务的要求,但是看到每次进入页面就重新渲染DOM然后再获取数据更新DOM,觉得作为一个前端工程师有必要优化下的加载逻辑,正好vue提供了 keep-alive 的功能,所以就试用了下。当然,干任何事儿都不会一帆风顺的,在路上的磕磕碰碰在所难免,故在此记录下遇到的问题,希望看到这篇文章的人能有所帮助。ps:这个也没多难。HTML部分:template> div class="转载 2017-05-04 16:14:51 · 30896 阅读 · 0 评论 -
vue2.0 keep-alive最佳实践
1.基本用法vue2.0提供了一个keep-alive组件用来缓存组件,避免多次加载相应的组件,减少性能消耗keep-alive>component> component>keep-alive>有时候 可能需要缓存整个站点的所有页面,而页面一般一进去都要触发请求的在使用keep-alive的情况下将首次触发请求写在created钩子函数中,就能实现缓存转载 2017-05-04 18:56:18 · 13162 阅读 · 1 评论