1.ref

在父组件中访问子组件实例,或者直接操作DOM元素时需要ref

<input ref="ipt">

通过this.$refs.ipt 得到此input

$refs是非响应式的,不应该在模板中做数据绑定

2.自定义事件

$on  $emit

<!--使用v-on在html中监听-->
<my-component v-on:test="callbackFun"></my-component>
<script>
//直接用$on监听
vm.$on('text',function(){})
</script>

3.跳过css检测

对于只使用js过度的元素使用v-bind:css = "false" 跳过vue对css的检测

4.自定义组件

自定义组件的名字不能用html关键字或者候选字,不然会被当成html元素来解析

5.子组件通过按钮调用父组件定义的方法

父组件:

<p @childBtn = "ServiseList"></p>

methods:{

 ServiseList(){

  router.push({

    name:'search',

    params:this.ListParameter

  })

  } 

}

子组件:

<button type="button" @click="commonality"></button>

methods:{

  commonality(){

    this.$emit("childBtn ")

  }

}

vue 采坑的更多相关文章

  1. VUE 采坑之旅-- Mint-ui 按需引入报出Module build failed: Error: Couldn't find preset "es2015" relative to directory "C:\\phpStudy\\PHPTutorial\\WWW\\text\\vuep\\vue-demo"

    首先按照mint-ui的文档中按需引入的要求,先执行 npm install babel-plugin-component -D 然后,将.babelrc文件替换了,但是后来我又将其改了(采坑过程我也 ...

  2. vue采坑及较好的文章汇总

    1:父子组件传动态传值 https://www.cnblogs.com/daiwenru/p/6694530.html  -----互传数据基本流程 https://blog.csdn.net/qq_ ...

  3. vue采坑一:全局API

    Vue.set Vue.set( target, key, value ),target不能是 Vue 实例,或者 Vue 实例的根数据对象,因为源码中做了如下判断: var ob = (target ...

  4. vue采坑之——vue里面渲染html 并添加样式

    在工作中,有次遇到要把返回的字符串分割成两部分,一部分用另外的样式显示. 这时候,我想通过对得到字符串进行处理,在需要特别样式的字符串片段用html标签(用的span)包裹起来再通过变量绑定就好了.不 ...

  5. vue采坑记录

    1.项目在浏览器运行的时候没有ico图标 <link rel="shortcut icon" type="image/x-icon" href=" ...

  6. vue项目打包采坑

    1. vue项目打包采坑 1.1. vue运行报错error:Cannot assign to read only property 'exports' of object '#' 这个错误我是在打包 ...

  7. axios采坑之路

    POST请求设置Content-Type 由于后端采用的是form表单形式上送参数,需要设置Content-Type axios设置如下 const _axios = axios.create(con ...

  8. nuxt 2.0采坑计之 (引入静态文件css)

    nuxt 2.0采坑计之静态文件css 外部引入css 全局引用方法为   (在nuxt.config.js配置中在   module.exports = {}  中添加) head: { meta: ...

  9. Service worker (@nuxtjs/workbox) 采坑记

    PWA(Progressive Web App)是前端的大趋势,它能极大的加快前端页面的加载速度,得到近乎原生 app 的展示效果(其实难说).PWA 其实是多种前端技术的组合,其中最重要的一个技术就 ...

随机推荐

  1. ACM-ICPC 2018 南京赛区网络预赛 J sum (找一个数拆成两个无平方因子的组合数)

    题目大意:就是找一个数拆成两个无平方因子的组合数,然后求个前缀和  ; 分析:运用筛法的思想 ,  因为有序对是由两个合法的数字组成的,所以只要保证第一个数合法,第二个数也合法就行,找出合法的第二个数 ...

  2. fastJson Gson对比及java序列化问题

    一个案例 POJO没有set方法, 造成反序列化时出现NPE问题.实际场景:POJO是第三方提供的,final public class XJSONTest { public static void ...

  3. 练习十七:python辨别数据类型

    关于python辨别数据类型可以用python type()方法,那么想要查看一串字符中每项类型,并逐一输出要怎么处理?看下我是怎么处理的 习题要求:输入一行字符,分别统计其中英文字母.数字.空格.和 ...

  4. excel单元格内容合并

    这几天在整理数据,有时候数据都在表格的不同单元格中,想把两格内容合并为一格,于是验证了两种方法 方法一: (1)在B1输入公式=A1&B1 (2)做完第一步后,选中B1后,鼠标移到单元格右下出 ...

  5. LeetCode 128 Longest Consecutive Sequence 一个无序整数数组中找到最长连续序列

    Given an unsorted array of integers, find the length of the longest consecutive elements sequence.Fo ...

  6. 记录一个在线压缩和还原压缩js代码的工具

    packer – javascript 压缩工具 http://dean.edwards.name/packer/ Javascript Beautifier ---可以恢复某些压缩工具压缩的js代码 ...

  7. Java面向对象_常用类库api——对象比较器

    概念:对两个或多个数据项进行比较,以确定他们是否相等,或确定他们之间的大小关系及排列顺序成为比较. 1.Comparable接口: 此接口强行对实现它的每个类的对象进行整体排序.这种排序被称为类的自然 ...

  8. python中*args, **kwargs理解

    先来看个例子: def foo(*args, **kwargs): print 'args = ', args print 'kwargs = ', kwargs print '----------- ...

  9. usb-host一步一步学(二)安卓在usb-host模式下列出当前连接的usb设备

    之前写了一个简单的例子usb-host一步一步学(一)安卓在usb-host模式下列出当前连接的usb设备,下面的这个例子是获取各种usb设备.usb接口以及usb连接点(endpoint) 正如上一 ...

  10. mybatis-plus 异常 Invalid bound statement (not found)

    最近吧项目中添加使用了mybatis-plus,发现操作sql的时候出现异常: Invalid bound statement (not found) ,异常位置位于mybatis-plus的jar中 ...