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

绑定的属性必须提前声明么?

  •  
  •   cs3230524 · May 10, 2020 · 3042 views
    This topic created in 2189 days ago, the information mentioned may be changed or developed.
    如果我单向绑定只做展示,有没有不提前声明就能渲染模板的方法?现在模板和填充的数据都有可能是动态的,不能提前声明出来。大家怎么处理这个需求的?
    13 replies    2020-06-04 10:46:16 +08:00
    cydysm
        1
    cydysm  
       May 10, 2020 via iPhone
    computed ?
    shintendo
        2
    shintendo  
       May 10, 2020
    想象不出“不能提前声明”的场景,能举个例子么
    gouflv
        3
    gouflv  
       May 10, 2020 via iPhone
    对象内部的属性可以动态添加
    cs3230524
        4
    cs3230524  
    OP
       May 10, 2020
    @shintendo 例如我有许多报告要打印,这些报告模板是后台维护的,报告的字段是用户定义的,所以是动态的。
    rabbbit
        5
    rabbbit  
       May 10, 2020
    如果是指 data 里的属性的话, 可以用 Vue.set 方法
    cs3230524
        6
    cs3230524  
    OP
       May 10, 2020
    换个方法吧,有没有办法让 data 里不存在的属性在模板渲染的时候不报错?
    例如:
    var vm = new Vue({
    el: "#app",
    data:{
    a:"test"
    }
    })


    ....

    <td>{{b}}</td>
    ....
    cs3230524
        7
    cs3230524  
    OP
       May 10, 2020
    能不能让不存在的属性 b,在渲染的时候不报错?
    Messiahhh
        8
    Messiahhh  
       May 10, 2020
    给个空字符串不好吗
    Jason2393
        9
    Jason2393  
       May 10, 2020 via iPhone
    @cs3230524 data 里定义一个对象 obj,你用户动态的属性都赋值给 obj,然后 obj.b 就行了呗? 如果要自动更新 ui,每次给 obj 赋值直接替换对象,而不是 obj.b=something ;或者 this.$set
    murmur
        10
    murmur  
       May 10, 2020
    不需要,可以用$set 进行设置,点号赋值有时候未必能响应,但是如果一开始就是不响应的属性,$set 可能都没用,必须先把旧的属性删了
    zysuper
        11
    zysuper  
       May 10, 2020
    data 里定义一个对象 obj, 然后用 immer 库修改 obj,最后把

    data.obj = produce(baseState, draftState => {
    draftState.push({todo: "Tweet about it"})
    draftState[1].done = true
    })

    react 用户说。;)
    weikexin
        12
    weikexin  
       May 11, 2020
    @cs3230524
    可以避免 b 不存在渲染时报错

    ` <td v-if="b">{{b}}</td> `
    ghosthcp516
        13
    ghosthcp516  
       Jun 4, 2020
    computed b () { return this.b || '' }
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   4400 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 84ms · UTC 05:31 · PVG 13:31 · LAX 22:31 · JFK 01:31
    ♥ Do have faith in what you're doing.