文档章节

vue.js中踩到的坑

李康德
 李康德
发布于 2017/04/24 19:33
字数 412
阅读 29
收藏 0
点赞 0
评论 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
深圳
前端工程师
微信小程序——使用setData修改数组中的单个对象

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

Originalee ⋅ 05/30 ⋅ 0

搭建 vue2 单元测试环境(karma+mocha+webpack3)

从网上找了很多例子关于单元测试,都是如何新建项目的时候的添加单元测试,用vue-cli中怎么添加,但是我的项目已经生成了,不能再一次重新初始化,这时如何添加单元测试,这里面遇到了好多坑...

nxmin ⋅ 05/23 ⋅ 0

前端-优雅的VueJS

Vue.js轻松实现页面后退时,还原滚动位置 前言 从Vue.js 2.x发布之后,陆陆续续做了七八个项目,摸索出来了一套自己的状态管理模式,我将之称为Vuet。它以规则来驱动状态更新,它带来的是开发...

掘金官方 ⋅ 01/08 ⋅ 0

十分钟上手-搭建vue开发环境(新手教程)

想写一些关于vue的文章已经很久了,因为这个框架已经火了很久,在公司里用的框架都比较老旧,但怎么也得跟上前端发展变化的潮流,这不,开始使用vue开发项目了,一遍开发一边踩坑中,今天要记...

祈澈姑娘 ⋅ 05/28 ⋅ 0

手摸手教你搭建vue-cli脚手架-详细步骤图文解析[vue入门]

写在前面: 使用 vue-cli 可以快速创建 vue 项目,vue-cli很好用,但是在最初搭建环境安装vue-cli及相关内容的时候,对一些人来说是很头疼的一件事情,本人在搭建vue-cli的项目环境的时候也是...

阿K1225 ⋅ 05/22 ⋅ 0

搭建 vue2 单元测试环境(karma+mocha+webpack3)

从网上找了很多例子关于单元测试,都是如何新建项目的时候的添加单元测试,用vue-cli中怎么添加,但是我的项目已经生成了,不能再一次重新初始化,这时如何添加单元测试,这里面遇到了好多坑...

mgbq ⋅ 05/23 ⋅ 0

你或许不知道Vue的这些小技巧

前言 用Vue开发一个网页并不难,但是也经常会遇到一些问题,其实大部分的问题都在文档中有所提及,再不然我们通过谷歌也能成功搜索到问题的答案,为了帮助小伙伴们提前踩坑,在遇到问题的时候...

OBKoro1 ⋅ 06/04 ⋅ 0

开发了一款写作软件(OSX,Windows),附带Electron开发指南

断断续续写了个把月,终于在昨天完成了第一版… 笔落写作 一款帮助网络写手更方便地进行小说创作的PC软件,目前支持 OSX/Windows 名字灵感来自于杜甫的一首诗,前两句是: 《寄李十二白二十韵...

林水溶 ⋅ 05/15 ⋅ 0

关于Vant库日期组件无法使用回调的坑及解决办法

Vant库对于开发商城类项目,真的是非常nice,会让你亲不自禁爱上它。支持按需加载、为商城类设计的移动端风格,非常完美。但是,本人在实际开发中,也遇到了一些小问题,折腾了老半天,最终得...

前端史努比 ⋅ 05/23 ⋅ 0

美团小程序框架mpvue 蹲坑指南

第一次接触小程序大概是17年初,当时小程序刚刚内侧,当时就被各种限制折腾的死去活来的,单向绑定, 没有promise,请求数限制,包大小限制,各种反人类,...反正我是感受到了满满的恶意. 最近接到一...

Noahlam ⋅ 05/15 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

Day 17 vim简介与一般模式介绍

vim简介 vi和Vim的最大区别就是编辑一个文件时vi不会显示颜色,而Vim会显示颜色。显示颜色更便于用户编辑,凄然功能没有太大的区别 使用 yum install -y vim-enhanced 安装 vim的三种常用模式...

杉下 ⋅ 44分钟前 ⋅ 0

【每天一个JQuery特效】根据可见状态确定是否显示或隐藏元素(3)

效果图示: 主要代码: <!DOCTYPE html><html><head><meta charset="UTF-8"><title>根据可见状态确定 是否显示或隐藏元素</title><script src="js/jquery-3.3.1.min.js" ty......

Rhymo-Wu ⋅ 53分钟前 ⋅ 0

OSChina 周四乱弹 —— 初中我身体就已经垮了,不知道为什么

Osc乱弹歌单(2018)请戳(这里) 【今日歌曲】 @加油东溪少年 :下完这场雨 后弦 《下完这场雨》- 后弦 手机党少年们想听歌,请使劲儿戳(这里) @马丁的代码 :买了日本 日本果然赢了 翻了...

小小编辑 ⋅ 今天 ⋅ 11

浅谈springboot Web模式下的线程安全问题

我们在@RestController下,一般都是@AutoWired一些Service,由于这些Service都是单例,所以并不存在线程安全问题。 由于Controller本身是单例模式 (非线程安全的), 这意味着每个request过来,...

算法之名 ⋅ 今天 ⋅ 0

知乎Java数据结构

作者:匿名用户 链接:https://www.zhihu.com/question/35947829/answer/66113038 来源:知乎 著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。 感觉知乎上嘲讽题主简...

颖伙虫 ⋅ 今天 ⋅ 0

Confluence 6 恢复一个站点有关使用站点导出为备份的说明

推荐使用生产备份策略。我们推荐你针对你的生产环境中使用的 Confluence 参考 Production Backup Strategy 页面中的内容进行备份和恢复(这个需要你备份你的数据库和 home 目录)。XML 导出备...

honeymose ⋅ 今天 ⋅ 0

JavaScript零基础入门——(九)JavaScript的函数

JavaScript零基础入门——(九)JavaScript的函数 欢迎回到我们的JavaScript零基础入门,上一节课我们了解了有关JS中数组的相关知识点,不知道大家有没有自己去敲一敲,消化一下?这一节课,...

JandenMa ⋅ 今天 ⋅ 0

火狐浏览器各版本下载及插件httprequest

各版本下载地址:http://ftp.mozilla.org/pub/mozilla.org//firefox/releases/ httprequest插件截至57版本可用

xiaoge2016 ⋅ 今天 ⋅ 0

Docker系列教程28-实战:使用Docker Compose运行ELK

原文:http://www.itmuch.com/docker/28-docker-compose-in-action-elk/,转载请说明出处。 ElasticSearch【存储】 Logtash【日志聚合器】 Kibana【界面】 答案: version: '2'services: ...

周立_ITMuch ⋅ 今天 ⋅ 0

使用快嘉sdkg极速搭建接口模拟系统

在具体项目研发过程中,一旦前后端双方约定好接口,前端和app同事就会希望后台同事可以尽快提供可供对接的接口方便调试,而对后台同事来说定好接口还仅是个开始、设计流程,实现业务逻辑,编...

fastjrun ⋅ 今天 ⋅ 0

没有更多内容

加载失败,请刷新页面

加载更多

下一页

返回顶部
顶部