V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member  Sign In
fangwenxue
V2EX  ›  问与答

vue3 组件怎么传递变量

  •  
  •   fangwenxue · Jan 19, 2022 · 1369 views
    This topic created in 1570 days ago, the information mentioned may be changed or developed.
    <div class="tile-content">
       <Progress progressValue="{{item.disk}}" />
    </div>
            
    ### Progress.vue 
    script setup
    defineProps({
      progressValue: String
    })
    const getProgressColor = (v) => {
      console.log(v)
      return (parseInt(v) >= 80 ? 'bg-red-500' : 'bg-blue-500');
    }
    /script
    <template>
      <div class="progress">
        <div class="progress-bar" :class="getProgressColor(progressValue)" :style="{width: progressValue + '%'}"></div>
      </div>
    </template>
    
    • {{item.disk}} 被当成一个字符串了,怎么把 item.disk 的值传给 Progress
    • script 没有 <> 是有这个不让发
    5 replies    2022-01-20 10:11:58 +08:00
    TomatoYuyuko
        1
    TomatoYuyuko  
       Jan 19, 2022
    ?你为什么不直接 item.disk
    fangwenxue
        2
    fangwenxue  
    OP
       Jan 19, 2022
    @TomatoYuyuko
    <Progress progressValue="item.disk" /> 这样报错
    Danswerme
        3
    Danswerme  
       Jan 19, 2022   ❤️ 1
    <Progress :progressValue="item.disk" />
    dengshen
        4
    dengshen  
       Jan 19, 2022 via iPhone
    这是 react 写多了吧?至少看一下 vue 数据绑定部分的文档啊
    TomatoYuyuko
        5
    TomatoYuyuko  
       Jan 20, 2022
    @fangwenxue 动态绑定啊。。不加冒号就是静态的值
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   4642 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 42ms · UTC 10:05 · PVG 18:05 · LAX 03:05 · JFK 06:05
    ♥ Do have faith in what you're doing.