firhome
V2EX  ›  Vue.js

深夜请教 vuejs 的一个问题。

  •  
  •   firhome · Mar 15, 2016 · 3018 views
    This topic created in 3723 days ago, the information mentioned may be changed or developed.
    同步: https://segmentfault.com/q/1010000004613246

    数据
    [{

    name:'aaa',
    id:'0',
    iscur:false
    },{

    name:'bbb',
    id:'1',
    iscur:false
    },{

    name:'ccc',
    id:'2',
    iscur:true
    }
    ]

    html:

    <li v-for='item in data'>{{ item.name }}</li>

    我需要分别点击 li 添加一个 class cur ,同时更新状态到 data 里的 iscur
    操作数据的 iscur:true 时 当前 li 也自动添加 /删除 cur ,

    请问这个操作 用 vuejs 怎么实现呢?
    6 replies    2016-06-23 00:26:36 +08:00
    sox
        1
    sox  
       Mar 15, 2016
    擦,看文档,而且这个代码是给人看的吗
    eric6356
        2
    eric6356  
       Mar 15, 2016
    可以看一下 class 与 style 的绑定那一节,另外操作数据的时候可能需要用 Vue.set 来确保 Vue 能追踪到,这里挺复杂的。同学习中!
    emric
        3
    emric  
       Mar 15, 2016
    文档是用来看的。
    coolzjy
        4
    coolzjy  
       Mar 15, 2016
    ```html
    <li v-for='item in data' @click="item.iscur = !item.iscur" :class="{ cur: item.iscur }">{{ item.name }}</li>
    ```
    coolzjy
        5
    coolzjy  
       Mar 15, 2016
    @coolzjy 我是不是助长了张口就问的不良风气
    EnginDee
        6
    EnginDee  
       Jun 23, 2016
    似乎是 jquery 年代,思维还没转过来。 我也是 low 逼, jq 年代的老人了……
    About   ·   Help   ·   Advertise   ·   Blog   ·   API   ·   FAQ   ·   Solana   ·   2857 Online   Highest 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 466ea39e · 39ms · UTC 15:19 · PVG 23:19 · LAX 08:19 · JFK 11:19
    ♥ Do have faith in what you're doing.