参考网址:https://segmentfault.com/a/1190000010507616

下面栗子中,
callback是传递父组件的方法,
mutationName是传递父组件的数据,

App.vue
<search-bar class="f-fr" placeholder="请输入名字" mutationName='resetListData' :callback="callback"/>
SearchBar.vue
export default {
name: 'SearchBar',
data() {
return {
input: ''
}
},
methods: {
setName: function () {
var input = this.input;
if (input.trim() == '') {
alert("empty");
}
else {
Api.searchTest(this.input,this.success );
} },
success(responseData) {
this.callback(responseData);
},
},
props: ['placeholder', 'apiName', 'moduleName', 'mutationName','callback']
}

vue 父组件通过props向子组件传递数据/方法的方式的更多相关文章

  1. vue父组件传参给子组件

    其实组件之间传参有很多种方法: 1.通过本地存储 2.使用vuex状态管理 今天记录一下第三种方法 1.首页我们先创建一个项目(创建项目自行百度) 2.打开项目,在components文件夹下新建一个 ...

  2. 怎样在 Vue 里面使用自定义事件将子组件的数据传回给父组件?

    首先, Vue 里面的组件之间的数据流动是 单向 的, 数据可以从父组件传递给子组件, 但不能从子组件传递给父组件, 因为组件和组件之间是 隔离 的. 就像两个嵌套的 黑盒子 . 能通过 props ...

  3. 前端(二十二)—— vue组件:局部组件、全局组件、父组件数据传到子组件、子组件数据传到父组件、父子组件实现todoList

    Vue组件 一.组件介绍 每一个组件都是一个vue实例 每个组件均具有自身的模板template,根组件的模板就是挂载点,根组件也可以显式书写模板,会替换掉挂载点 每个组件模板只能拥有一个根标签 子组 ...

  4. Vue父子组件通信(父级向子级传递数据、子级向父级传递数据、Vue父子组件存储到data数据的访问)

    Vue父子组件通信(父级向子级传递数据.子级向父级传递数据.Vue父子组件存储到data数据的访问) 一.父级向子级传递数据[Prop]: ● Prop:子组件在自身标签上,使用自定义的属性来接收外界 ...

  5. vue组件中的样式属性:scoped,解决在父组件中无法修改子组件样式问题

    Scoped CSS规范是Web组件产生不污染其他组件,也不被其他组件污染的CSS规范. vue组件中的style标签标有scoped属性时表明style里的css样式只适用于当前组件元素,它是通过使 ...

  6. Vue 的自定义事件系统:实现子组件跟父组件通信

    父组件可以在使用子组件的地方直接用 v-on 来监听子组件触发的事件 v-on 写在引用的子组件上, 语句 this.$emit('xxx') ,写在子组件里.

  7. vue3常见问题及解决方案(四)父组件切换行,然后子组件切换tab,子组件内的数据不刷新

    问题描述 父组件切换行,然后子组件切换tab,子组件内的数据不刷新. 例如父组件为订单,子组件为订单相关商品和相关客户,商品和客户使用tab选项卡组织. 当tab显示商品页时,切换订单,商品页内容跟着 ...

  8. Vue--子组件互相传值,子组件来回传值,传值反复横跳

    Vue--子组件传值,子组件来回传值,子组件传值反复横跳 我不不仅要子组件之间直接传值,我还要传过去再传回来,传回来再传过去,子组件直接反复横跳 解决问题 给组件传值,并不知道改值的校验结果 同一个组 ...

  9. sql实现同时向主表和子表插入数据方法

    使用sql语句实现同时向主表和子表插入数据方法: Oracle: -- oracle创建sequence create sequence SEQ_test minvalue 1 maxvalue 99 ...

随机推荐

  1. git pull 提示 There is no tracking information for the current branch

    在执行git pull的时候,提示当前branch没有跟踪信息: git pull There is no tracking information for the current branch. P ...

  2. C++ 空字符('\0')和空格符(' ')

    1.从字符串的长度:-->空字符的长度为0,空格符的长度为1. 2.虽然输出到屏幕是一样的,但是本质的ascii code 是不一样的,他们还是有区别的. #include<iostrea ...

  3. 异步加载script,提高前端性能(defer和async属性的区别)

    一.异步加载script的好处 为了加快首屏响应速度,前端会采用代码切割.按需加载等方式优化性能.异步加载script也是一种前端优化的手段. 就好比如果我的页面其中一个功能需要打开地图,但是地图的j ...

  4. linux服务器安装brook服务端 使用brook客户端

    既然你已经找到了此文章,说明已经知道brook的用途了,不做介绍,下面讲安装方法: 连接服务器,随便cd一个安装目录,例如: mkdir brook && cd brook 2.进re ...

  5. P1330 封锁阳光大学

    传送门 思路: 依题意可知,在图中的每一条边有且只有一个点被选中(阻止老曹刷街),那么就可以对其采取二分图染色,一条边中:一个点为黑色,另一个点为白色:如果一条边中的两个端点的颜色相同,则说明无解,输 ...

  6. Microsoft Active Directory(LDAP)连接常见错误代码

    接下来显示的认证错误类似于这样: "The exception is [ LDAP: error code 49 - 80090308: LdapErr: DSID-0Cxxxxxx, co ...

  7. Ajax请求导出Excel的问题

    文章转载自: http://yuwenlin.iteye.com/blog/2275289 Ajax请求导出Excel的问题描述: 前端发起Ajax请求get或post,后台使用Poi生成excel文 ...

  8. JS self=this

    1.每个函数都会有自己的this和arguments:this对象绑定运行环境,arguments绑定调用参数. 2.全局函数:this和全局环境绑定,浏览器指向全局window对象(node.js中 ...

  9. Ubuntu 16.04下docker ce的安装(待完善)

    参见:https://www.cnblogs.com/senlinyang/p/8203191.html https://blog.csdn.net/qq_34906391/article/detai ...

  10. 管家基因 | Human housekeeping genes

    管家基因就是在细胞里稳定表达的基因,及时在胁迫状态下,表达的差异也不大. 以前做实验的时候就经常听说管家基因,因为在做RT-PCR的时候需要同时检测管家基因,这样可以用于矫正我们不同批次的结果. Li ...