1、子组件

<base-input ref="usernameInput"></base-input>
this.$refs.usernameInput

2、子元素

<input ref="input">

方法中:

console.log(this.$refs.input.value)

vue 访问子组件示例 或者子元素的更多相关文章

  1. vue+elementUI项目,父组件向子组件传值,子组件向父组件传值,父子组件互相传值。

    vue+elementUI项目,父组件向子组件传值,子组件向父组件传值,父子组件互相传值. vue 父组件与子组件相互通信 一.父组件给子组件传值 props 实现父组件向子组件传值. 1父组件里: ...

  2. Vue最常用的组件通讯有三种:父->子组件通讯、子->父组件通讯,兄弟组件通讯.(template用的pug模板语法)

    Vue组件通讯   Vue最常用的组件通讯有三种:父->子组件通讯.子->父组件通讯,兄弟组件通讯.(template用的pug模板语法) 1.父->子组件通讯 父->子组件通 ...

  3. Vue访问子组件实例或子元素

    1 尽管存在 prop 和事件,有的时候你仍可能需要在 JavaScript 里直接访问一个子组件(例如,调用子组件的方法).为了达到这个目的,你可以通过 ref 特性为这个子组件赋予一个 ID 引用 ...

  4. vue.js 父组件如何触发子组件中的方法

    组件 什么是组件? 组件 (Component) 是 Vue.js 最强大的功能之一.组件可以扩展 HTML 元素,封装可重用的代码.在较高层面上,组件是自定义元素,Vue.js 的编译器为它添加特殊 ...

  5. vue 父组件给子组件传值,子组件给父组件传值

    父组件如何给子组件传值 使用props 举个例子: 子组件:fromTest.vue,父组件 app.vue fromTest.vue <template> <h2>{{tit ...

  6. vue中父组件给子组件传值,子组件给父组件传值

    1.父组件传给子组件 父元素中 子元素中(通过props传值) 2.子组件传给父组件 子元素中(this.$emit(传过去的名字,传的参数)) 父元素中 通过changeShow的参数data 把修 ...

  7. 【vue】父组件主动调用子组件 /// 非父子组件传值

    一  父组件主动调用子组件: 注意:在父组件使用子组件的标签上注入ref属性,例如: <div id="home"> <v-header ref="he ...

  8. vue父组件调用子组件方法、父组件向子组件传值、子组件向父组件传值

      一.父组件调用子组件方法 父组件代码  parent.vue <template> <div> <button @click="parentFun" ...

  9. vue 关于父组件无法触发子组件的事件的解决方法

    一般情况导致无法触发子组件的方法  基本都是由于子组件未渲染完成 就进行了调用,解决方法如下: 1.加定时器  setTimeout(() => { //加定时器原因是,子组件页面未渲染处理就做 ...

随机推荐

  1. 算法详解(LCA&RMQ&tarjan)补坑啦!完结撒花(。◕ˇ∀ˇ◕)

    首先,众所周知,求LCA共有3种算法(树剖就不说了,太高级,以后再学..). 1.树上倍增(ST表优化) 2.RMQ&时间戳(ST表优化) 3.tarjan(离线算法)不讲..(后面补坑啦!) ...

  2. libv4l 库【转】

    转自:http://www.cnblogs.com/emouse/archive/2013/03/05/2944522.html V4L2摸索了两天还是一头雾水,今天调试一个程序发现两个头文件: #i ...

  3. Linux中tty框架与uart框架之间的调用关系剖析【转】

    转自:http://developer.51cto.com/art/201209/357501.htm 之前本人在"从串口驱动的移植看linux2.6内核中的驱动模型 platform de ...

  4. JS或jsp获取Session中保存的值

    JS是不能读取Session中的值的 . session是服务器对象, javascript是客户端脚本,你能做的操作就是把这个值用 <%=%>输出到页面的javascript中参与运算, ...

  5. python--math

    >>> import math >>> >>> # ceil,取大于等于x的最小的整数值 >>> math.ceil(4) 4 ...

  6. Appium+python自动化21-DesiredCapabilities详解【转载】

    Appium Desired Capabilities Desired Capabilities 是由 keys 和 values 组成的 JSON 对象. 举个简单例子: { "platf ...

  7. RobotFramework自动化3-搜索案例【转载】

    本篇转自博客:上海-悠悠 原文地址:http://www.cnblogs.com/yoyoketang/tag/robotframework/ 前言 RF系列主要以案例为主,关键字不会的可以多按按F5 ...

  8. AC日记——可能的路径 51nod 1247

    可能的路径 思路: 看到题目想到gcd: 仔细一看是更相减损: 而gcd是更相减损的优化版: 所以,对于每组数据判断gcd是否相等就好: 来,上代码: #include <cstdio> ...

  9. [thinkphp] 如何解析ajaxReturn返回的json字符串

    success: function(data){ var dataObj=eval("("+data+")");//转换为json对象 alert(dataOb ...

  10. phpcms编辑器添加一键排版控件

    CKEditor添加一键排版插件实例,大家都知道phpcms也是ckeditor编辑器,那么如果增加这个一键排版这个牛逼功能呢增加好了后,效果图是这样的 废话不多说,直接说步骤第一步:config.j ...