vue点击父组件里面的列表动态传值到子组件
<template>
<div>
爸爸
<div style="background-color:yellow;margin-top:10px" v-for="(el,index) in getArrary" :key="index" @click="sendId(el.id)">{{el.id}}</div>
<Good :send='data'></Good>
</div>
</template>
<script>
import Good from './good'
export default {
name: 'helloworld',
components: { Good },
data () {
return {
getList: {
data: 'ok'
},
data:'',
getArrary:[
{
id:
},
{
id:
},
{
id:
},
{
id:
},
{
id:
}
]
}
},
methods: {
sendId:function(item){
this.data=item
}
}
}
</script>
// 年后
<style > </style>
上面是父组件
下面是子组件
<template>
<div class="hello">
儿子 {{this.send}}
</div>
</template>
<script>
export default {
name: 'project',
props: ['send'],
data () {
return {
}
},
methods: {
},
created: function () {
// this.getSomeThing()
},
watch:{
getNewData:function (){
return this.send
}
}
}
</script>
点击第一行前

点击第一行后

vue点击父组件里面的列表动态传值到子组件的更多相关文章
- vue 父组件动态传值至子组件
1.进行数据监听,数据每次变化就初始化一次子组件,进行调取达到传递动态数据的目的普通的监听: watch:{ data: function(newValue,oldValue){ doSomeThin ...
- vue使用props动态传值给子组件里的函数用,每次更新,呼叫函数
父组件 <template> <div id="app"> <div>详情内容</div> <button v-on:clic ...
- iview 父组件动态传值给子组件
父组件 <maintenance-super :show="{'modalSuper':modalSuper,'myData':myData}" @on-close=&quo ...
- vue 父组件使用keep-alive和infinite-scroll导致在子组件触发父组件的infinite-scroll方法
(vue.js)vue 父组件使用keep-alive和infinite-scroll导致在子组件触发父组件的infinite-scroll方法”问题疑问,本网通过在网上对“ (vue.js)vue ...
- vue父组件调用子组件方法、父组件向子组件传值、子组件向父组件传值
一.父组件调用子组件方法 父组件代码 parent.vue <template> <div> <button @click="parentFun" ...
- 解决vue项目中遇到父组件的按钮或操作控制重新挂载子组件但是子组件却无效果的情况
在vue项目中终会遇到需要父组件的按钮或操作控制重新挂载子组件的需求,我在新项目中就遇到这种需求.真实场景是父组件的早,中,晚三个按钮(代表三个时间段)来控制子组件的table表格列的动态加载. 子组 ...
- vue+elementUI项目,父组件向子组件传值,子组件向父组件传值,父子组件互相传值。
vue+elementUI项目,父组件向子组件传值,子组件向父组件传值,父子组件互相传值. vue 父组件与子组件相互通信 一.父组件给子组件传值 props 实现父组件向子组件传值. 1父组件里: ...
- 【转】Vue组件一-父组件传值给子组件
Vue组件一-父组件传值给子组件 开始 Vue组件是学习Vue框架最比较难的部分,而这部分难点我认为可以分为三个部分学习,即 组件的传值 - 父组件向子组件中传值 事件回馈 - 子组件向父组件发送消息 ...
- vue 组件-父组件传值给子组件
父组件通过属性,传值给子组件,子组件通过,props数组里的名称来接受父组件传过来的值. HTML部分: <div id="app"> <tmp1 :parent ...
随机推荐
- 写在NOIP2018前
不知不觉距离NOIP2018还有两天,两个月的停课生活即将结束 此时心里总感觉装着许多话,想要将其倾诉却发现连哪怕一句也凝结不出 只觉得这两月像是场荒诞的冒险,好像我想做的什么都做了,又感觉我其实一事 ...
- R_数据操作_高级_04
数学函数: abs(x) 绝对值 sqrt(x) 平方根 ceiling(x) 放回不小于x的最小整数 floor(x) 不小于x的最大整数 trunc(x) 先0方向截取x的整数部分 ...
- awk 概述及常用方法总结
awk 简介 awk是一个文本处理工具,通常用于处理数据并生成结果报告, awk的命名是它的创始人 Alfred Aho.Peter Weinberger和Brian Kernighan 姓氏的首个字 ...
- git 打tag标着版本
1.git tag v1.0 2.git push origin v1.0
- Keras实现Hierarchical Attention Network时的一些坑
Reshape 对于的张量x,x.shape=(a, b, c, d)的情况 若调用keras.layer.Reshape(target_shape=(-1, c, d)), 处理后的张量形状为(?, ...
- 昨天521表白失败,我想用Python分析一下...表白记录和聊天记录
昨天跟喜欢的妹子表白了. 失败了!.下面是表白的聊天记录: (跟妹子已经认识一段时间) 我:灭嘤嘤,我喜欢你. 妹子:你干嘛? 我:今天520,跟你表白鸭. 妹子:那....有多喜欢? 我: 有很多很 ...
- (2) openstack--keystone
yun1 OpenStack packages yum install python-openstackclient -y yum install openstack-selinux SQL data ...
- 深入理解JVM内幕:从基本结构到Java 7新特性[转]
英文原文:cubrid,编译:ImportNew - 朱伟杰 译文链接:http://www.importnew.com/1486.html [如需转载,请在正文中标注并保留原文链接.译文链接和译者等 ...
- 凤凰新闻APP的增长黑客流程步骤经验:3.5星|《我不是产品经理》
“ 我问了他三个问题.●你是AI科学家或者算法工程师吗?答:不是.●你想天天坐在电脑旁点鼠标或者打电话吗?答:不想.●你愿意每天盯着数据仪表盘定策略并与生产者做运营沟通吗?答:不愿意.我回答他:你别去 ...
- linux网络编程之posix线程(二)
继续接着上次的posix线程来学习: 回顾一下创建线程的函数: pthread_att_t属性变量是需要进行初始化才能够用的,一定初始化了属性变量,它就包含了线程的多种属性的值,那到底有哪些属性了,下 ...