V2EX = way to explore
V2EX 是一个关于分享和探索的地方
Sign Up Now
For Existing Member  Sign In
xing393939
V2EX  ›  Vue.js

关于 vue3 用 ref 定义响应式的问题

  •  
  •   xing393939 ·
    xing393939 · May 15, 2024 · 2641 views
    This topic created in 723 days ago, the information mentioned may be changed or developed.

    代码 1: https://run.iviewui.com/GJQd3slb

    代码 2: https://run.iviewui.com/FoCmnwDq

    为什么代码 1 的输入框输入内容后,点击 click ,txt 的内容还是空的,而代码 2 就是 ok 的?

    (两者的区别仅仅在于第 8 行)

    8 replies    2024-05-16 14:08:17 +08:00
    rabbbit
        1
    rabbbit  
       May 15, 2024   ❤️ 1
    txt.value = msg.aaa
    ->
    txt.value = msg.value.aaa
    qq347891134
        2
    qq347891134  
       May 15, 2024   ❤️ 1
    少了.value ,应该是
    const onClick = () => {
    txt.value = msg.value.aaa
    }
    </script>
    QAQqingju
        3
    QAQqingju  
       May 15, 2024   ❤️ 1
    ref 需要.value
    zzzzhan
        4
    zzzzhan  
       May 15, 2024   ❤️ 1
    你知道赋值给 txt.value ,为什么不知道取值的时候也要取 msg.value
    peasant
        5
    peasant  
       May 15, 2024   ❤️ 1
    https://cn.vuejs.org/api/reactivity-core#ref

    用 ref 的在 js 里获取值必须用.value 来取值,reactive 不需要
    marsKnight
        6
    marsKnight  
       May 15, 2024   ❤️ 1
    vue3 中 ref 和 reactive 使用是不一样的 ref 创建的必须使用.value 去访问值 reactive 创建的可以直接通过对象属性去修改值 楼主可以看看官网二者介绍
    lisongeee
        7
    lisongeee  
       May 15, 2024   ❤️ 1
    ts 的应用场景之一就是这种代码,在 ts 里你的第一段代码会报编译错误
    Dik1212
        8
    Dik1212  
       May 16, 2024
    我好奇,定义 const msg = ref({}),你的 msg.aaa 编译器不报错?
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   1112 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 40ms · UTC 18:25 · PVG 02:25 · LAX 11:25 · JFK 14:25
    ♥ Do have faith in what you're doing.