zoukankan      html  css  js  c++  java
  • VUE父子组件相互传值

    passer.vue中代码
    首先在文件中引入组件 import canvasDraw from '@/components/CanvasDraw/canvasDraw'
    局部注册组件:components: { canvasDraw },
    HTML中使用组件 <canvas-Draw :imgSrc="formLabelAlign.src" @custom="custom" > </canvas-Draw>
    imgSrc:向组件传递值
    custom:自定义组件回传数据的方法data为canvasDraw回传的数据例如:
    custom(data){
       if(data.type==1){
          ...
        }else{
          ...
        }
    },


    canvasDraw中代码
    在export default中定义imgSrc来接收传递过来的值例: props:['imgSrc']。
    这样就可以直接在HTMl终使用imgSrc例如: <img :src="imgSrc" >,
    当canvasDraw组件有数据需要返回到passer.vue中时可以这样this.$emit('custom',{'type':1,'data':''}); 大括号内为传递的data参数

  • 相关阅读:
    LeetCode
    LeetCode
    LeetCode
    深度学习笔记 (二) 在TensorFlow上训练一个多层卷积神经网络
    LeetCode
    LeetCode
    LeetCode
    LeetCode
    LeetCode
    LeetCode
  • 原文地址:https://www.cnblogs.com/luzt/p/11677611.html
Copyright © 2011-2022 走看看