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 ...
随机推荐
- 【转载】C#使用as关键字将对象转换为指定类型
在C#的编程开发过程中,很多时候涉及到数据类型的转换,可使用强制转换的方式,不过强制转换数据类型有时候会抛出程序异常错误,可以使用as关键字来进行类型的转换,如果转换成功将返回转换后的对象,如果转换不 ...
- 返回ArrayBuffer数据下载
返回的数据 const blob = new Blob([response.data]); if ('download' in document.createElement('a')) { const ...
- Fortify漏洞之Sql Injection(sql注入)
公司最近启用了Fortify扫描项目代码,报出较多的漏洞,安排了本人进行修复,近段时间将对修复的过程和一些修复的漏洞总结整理于此! 本篇先对Fortify做个简单的认识,同时总结一下sql注入的漏洞! ...
- iOS开发-NSArray
忙了一上午,解决了几个bug,现在终于抽出来一点时间喝点水休息下, 想着系列这么浩大的一个工程,才刚刚开始写,不能断了,就跟写小说一样,既然是系列,那么就需要不停更... 好吧. 简单的说说iOS开发 ...
- arm-none-eabi/bin/ld: build/com.zubax.gnss.elf section `.text' will not fit in region `flash'
出现如下错误: /arm-none-eabi/bin/ld: build/com.zubax.gnss.elf section `.text' will not fit in region `flas ...
- 使用pandoc制作幻灯片
示例Md % Habits % John Doe % March 22, 2005 # In the morning ## Getting up - Turn off alarm - Get out ...
- Vue路由嵌套和命名视图
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 第四篇:python基础之杂货铺
在这一篇中我们将对上几篇的Python零碎的知识进行补充,即字符串的格式化输出,以及深浅拷贝,接下来我们将对这两种进行一一介绍. 一.字符串格式化输出 关于字符串的格式化输出,我们需要了解为什么需要字 ...
- 使用Wireshark对手机抓包设置说明
一.原因 1.手机目前没有类似的抓包工具可以直接对手机进行抓包 2.一般数据交换的路线是:手机——>运营商——>服务器,可以在手机和运营商中间加一道网卡变成:手机——>PC网卡——& ...
- Entity Framework 在MySQL中执行SQL语句,关于参数问题
在Entity Framework中添加MySQL模型,在写代码的过程中需要直接执行SQL语句. 在SQL语句中用到了@curRank := 0 这样在SQL语句中定义参数,同时还会有传入参数:ai. ...