文档章节

vue.js中踩到的坑

李康德
 李康德
发布于 2017/04/24 19:33
字数 412
阅读 49
收藏 0

1、配置dev-sever.js中的本地数据:

var apiRoutes = express.Router();
apiRoutes.post('/index',function (req,res) {
res.json({
  errno:0,
  data:index
})
})
app.use('/api',apiRoutes)

2、当项目中应用到了vuex时, npm i -S babel-polyfill ; 然后可以在mian.js的最上面

import 'babel-polyfill '

3、在vue中修改索引数组的数据时,应该采用js的Array的方法,不可直接采用等号赋值的方式修改,那样会让mvc失去效果! 范例:

        this.list[0]=true //数据中修改了,但是在dom中未修改!
        this.list.splice(0,1,true); //数据中修改了, dom中由于mvc的性质也修改了!

4、自定义指令:

  1. vnode.context 是组件中的vue实例 用发等同于组件中的 this, 2、

5、当路由跳转页面时,url不同但是使用的都是同一组件的时候,vue会继续使用已经渲染的组件,并不会销毁一个在从新实例化一个, 这个时候可能导致页面并没有变化,解决方法是在组件中监听路由的变化:

watch: {
    '$route' (to, from) {
      // 对路由变化作出响应...
    }

6、插件挂载到全局 适用于路由: mian.js中的代码应该是这样的:

import Vue from 'vue'
import App from './App'
import store from './store.js'//引入自定义的vuex模块
import router from './router/index.js'//引入自定义的路由模块
import resource from 'vue-resource'
Vue.use(resource)

/* eslint-disable no-new */
new Vue({
 store,// ! vuex挂载到全局
 router, //! 将路由挂载到全局
 render: h => h(App)
}).$mount('#app-box')
  1. vue的过渡效果 配合animate.css 使用
<transition enter-active-class="zoomIn" leave-active-class="zoomOut">
<div class='animated'></div>
            // animated  是动画的播放时间
            //enter-active-class dom元素出现时执行的过渡效果
            //  leave-active-class  dom元素消失时执行的过渡效果
</transition>

© 著作权归作者所有

共有 人打赏支持
李康德
粉丝 3
博文 10
码字总数 6220
作品 0
深圳
前端工程师
私信 提问
关于vue-area-linkage走过的坑

最近写的项目是vue框架,搭配element-ui框架。这个框架上手快,而且页面的大部分样式都有现成的可以用,使用起来比较方便。前几天有一个需求是要写省市区联动选择,上网搜罗了一遍之后发现了...

blueluu
06/26
0
0
Vue 项目升级到 webpack4.x 小纪【附代码】

自 webpack 4.x 发布以来,就独得码农恩宠。我公司的项目是基于 webpack 3.x 版本的 vue 项目, 当时是用 vue-cli 工具构建的项目,项目开发完成后发现打包性能低下,而且项目是多页面的,需...

linghuam
08/15
0
0
微信小程序——使用setData修改数组中的单个对象

微信小程序已经出来挺久的时间了,之前只是在文档上粗略的看了一下,最近稍得空闲,便利用微信小程序平台写一个练手的项目,顺便学习一下小程序开发,感觉大体跟前端开发基本类似,但是因为是...

Originalee
05/30
0
0
Vue-Router源码学习之install方法

Vue是怎么注册插件的呢? 使用过Vue的coder都知道,如果想注册一个vue的插件,在vue对象上能够使用的话(并不是绑在Vue.prototype上的那种暴力方式),必须使用Vue.use(你的插件)的方式来注册...

酸楚与甘甜
09/07
0
0
简易商城小程序全栈开发(mpvue+koa+mongodb)

前言 接触小程序有一段时间后并且多多少少做了一些项目之后,又开始了vue的旅程,受其核心思想的影响,对数据/状态管理、组件化、跨平台等都有较高的追求,mpvue 是一个使用 Vue.js开发小程序...

mosa
07/26
0
0

没有更多内容

加载失败,请刷新页面

加载更多

大数据学习之大数据技术笔记—spring入门

篇一 spring介绍 spring.io 官网 快速开始 Aop 面向切面编程,可以任何位置,并且可以细致到方法上 连接框架与框架 Spring 就是 IOC AOP 思想 有效的组织中间层对象一般都是切入 service 层 ...

董黎明
4分钟前
1
0
Linux如何查看进程、杀死进程、启动进程等常用命令

关键字: linux 查进程、杀进程、起进程 1.查进程 ps命令查找与进程相关的PID号: ps a 显示现行终端机下的所有程序,包括其他用户的程序。 ps -A 显示所有程序。 ps c 列出程序时,显示每个程...

临江仙卜算子
22分钟前
3
0
ASP.NET Core MVC 静态文件配置

在启动文件中添加以下配置 public class Startup{ public IServiceProvider ConfigureServices(IServiceCollection services) { services.AddDirectoryBrowser(); ......

whltian
33分钟前
1
0
linux之自定义命令

本人使用的是ubuntu系统,不喜欢建各种桌面快捷链接,但是每次启动个软件,去查找又麻烦,所以自定义了命令,来快捷的启动应用: 1、修改/etc/bash.bashrc,在文件末尾,加上如下List-1中的内...

克虏伯
40分钟前
7
0
linux基础

系统安全 sudo su chmod setfacl 进程管理 w top ps kill pkill pstree killall 用户管理 id usermod useradd groupad userdel 文件系统 mount umount fsck df du 网络应用 curl telnet mail......

关元
42分钟前
7
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部