Giter Site home page Giter Site logo

文档里要不要交代一下 v-for 和 v-on 结合的时候怎么在 method handler 中得到 item 数据? about v2.cn.vuejs.org HOT 6 CLOSED

vuejs avatar vuejs commented on July 17, 2024
文档里要不要交代一下 v-for 和 v-on 结合的时候怎么在 method handler 中得到 item 数据?

from v2.cn.vuejs.org.

Comments (6)

yyx990803 avatar yyx990803 commented on July 17, 2024

直接 @click="foo(item)" 即可

是可以提一下

from v2.cn.vuejs.org.

Jinjiang avatar Jinjiang commented on July 17, 2024

所以只能写成文档中的“Inline Statement Handler”咯?这样感觉 method handler 在列表里就有点鸡肋了,是否可以在 method handler 里通过 this.item 得到呢?感觉这样蛮方便的,也就不需要 inline statement handler 了

(我理解的对吗?)

from v2.cn.vuejs.org.

yyx990803 avatar yyx990803 commented on July 17, 2024

这样的话 method 的 this context 就是不确定的了... 会让代码很难理解的。inline statement handler 没什么问题啊

from v2.cn.vuejs.org.

Jinjiang avatar Jinjiang commented on July 17, 2024

这会导致相同的逻辑在普通场景可以直接 method handler,然后通过 this 拿到相应的数据,而在列表中则不行,必须通过 inline 的方式,而且除了 item 其它的其实都可以通过 this 拿到,不需要在 template 里显示写明,总觉得不方便就是了……

而且在 v-foritemitems 之外的 key 应该都是可以被直接识别的,现在 template 里的 context 和 method handler 里的 this context 差一点点,对应不起来,从这个角度把两边对应一下我觉得反而好理解一些,实现角度应该就是先 Object.create 然后 proxy 吧?印象中你以前版本好像这么实现过我还觉得蛮好的……

from v2.cn.vuejs.org.

yyx990803 avatar yyx990803 commented on July 17, 2024

methods 的 API 设计遵循的是一个简单的道理:任何 method 内部的 this 永远指向其所属的 vm 实例。如果一个 method 的 this 会因为其在模板中被调用的位置而改动,那么 vm.method() 该如何理解呢?

在模板里的情况更类似于:

vm.items.forEach(function (item) {
  vm.method(item)
})

method 并不存在于 for 的 scope 上,而是存在于 vm 上。

另外,现在 1.0 阶段必须考虑 API 的稳定性,不可能随便就上 breaking change 的。

from v2.cn.vuejs.org.

Jinjiang avatar Jinjiang commented on July 17, 2024

got

from v2.cn.vuejs.org.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.