V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
akaylh
V2EX  ›  Vue.js

import 后的组件,如果在代码里给它传数据?

  •  
  •   akaylh · 2016-11-03 08:16:24 +08:00 · 1971 次点击
    这是一个创建于 2940 天前的主题,其中的信息可能已经有所发展或是发生改变。

    比如有组件 C 和 D ,他们根据传入的数据不同,界面也不一样。 现在组件 B 里 import 组件 C 和 D ,请问如何在 js 代码里给 C , D 组件传递数据呢?

    
    <template>
        <div>
         <component :is="currentView"></component>
       </div>
    </template>
    
    <script>
    
      import C from './C.vue'
      import D from './D.vue'
    
        export default {
          data() {
            return {
              currentView:null
            }
          },   
          methods: {
            clickSwitch(row, event){
              if(row.type==='c'){
                this.currentView = C; //这里如果给 C 组件传送数据呢?
              }else{
                this.currentView = D;//这里如果给 D 组件传送数据呢?
              }
            }
          }
        }
    </script>
    
    5 条回复    2016-11-03 09:25:38 +08:00
    readonly
        1
    readonly  
       2016-11-03 08:31:09 +08:00 via iPhone
    is 只接收字符串吧!那么属性就是写在 component 上面了
    hxsf
        2
    hxsf  
       2016-11-03 08:33:31 +08:00 via iPhone   ❤️ 1
    v-if 可破
    Troevil
        3
    Troevil  
       2016-11-03 08:34:05 +08:00   ❤️ 1
    component 内定义
    props :{
    xx:{ type:String }
    }

    , 然后 调用时 可用
    < component :xx="aa" >
    aa 可以为变量或者字符串等
    Troevil
        4
    Troevil  
       2016-11-03 08:34:37 +08:00
    @Troevil 然后 component 内可以接收此参数
    akaylh
        5
    akaylh  
    OP
       2016-11-03 09:25:38 +08:00
    @Troevil @hxsf 你们提供的方法都可以,非常感谢!
    关于   ·   帮助文档   ·   博客   ·   API   ·   FAQ   ·   实用小工具   ·   3055 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 24ms · UTC 13:51 · PVG 21:51 · LAX 05:51 · JFK 08:51
    Developed with CodeLauncher
    ♥ Do have faith in what you're doing.