The Wayback Machine - https://web.archive.org/web/20190322235143/https://github.com/vuejs/vue/issues/9707
Skip to content
Sign in Sign up

/vue

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Different behaviors of Arrow function and function #9707

Closed
zhangenming opened this Issue Mar 15, 2019 · 2 comments
Closed

Different behaviors of Arrow function and function #9707

zhangenming opened this Issue Mar 15, 2019 · 2 comments

Comments

Assignees
No one assigned
Labels
bug has PR
Projects
None yet
Milestone
No milestone
3 participants
@zhangenming @Justineo @DanielDanaee
@zhangenming
Copy link

zhangenming commented Mar 15, 2019 •
edited by Justineo

Version

2.6.8

Reproduction link

https://codepen.io/zhangenming/pen/GexZQK

Steps to reproduce

    <input :value="price" @input="e=>price=e.target.value">

Compiled:

    with(this){return _c('input',{domProps:{"value":price},on:{"input":e=>price=e.target.value}})}
    <input :value="price" @input="function f(e){price=e.target.value}">// this wont' be work

Compiled:

    with(this){return _c('input',{domProps:{"value":price},on:{"input":function($event){function f(e){price=e.target.value}}}})}

What is expected?

can be work

What is actually happening?

this wont' be work
@Justineo

This comment has been minimized.

Sign in to view
Copy link
Member

Justineo commented Mar 15, 2019 •
edited

I helped re-formatted your issue and fixed a typo.

It seems that the template compiler is not generating correct code with function literals with a function name.

See the difference " rel="nofollow">here.

@Justineo Justineo added the bug label Mar 15, 2019

Justineo added a commit to Justineo/vue that referenced this issue Mar 15, 2019

@Justineo
fix(codegen): inline function expression can be named inside a `v-on`… 
… expression (fix vuejs#9707)
Verified
This commit was signed with a verified signature.
@Justineo Justineo GU Yiling
GPG key ID: 215DF196062CF3CF Learn about signing commits
83af624

@Justineo Justineo referenced this issue Mar 15, 2019

Merged

fix(codegen): inline function expression can be named inside a `v-on`… #9709

6 of 13 tasks complete

@Justineo Justineo added the has PR label Mar 15, 2019

@DanielDanaee

This comment has been minimized.

Sign in to view
Copy link

DanielDanaee commented Mar 15, 2019

Why would you expect this to work? directive values should be method names or methods only.

Have a look at the following part of the documentation:

https://vuejs.org/v2/guide/events.html#Method-Event-Handlers

This is probably what you should be doing:

<input :value="price" @input="getTargetValue(e)">

getTargetValue(e){ return (this.price = e.target.value) }

@yyx990803 yyx990803 closed this in #9709 Mar 18, 2019

yyx990803 added a commit that referenced this issue Mar 18, 2019

@Justineo @yyx990803
fix(codegen): support named function expression in v-on (#9709) 
fix #9707
Loading status checks…
3433ba5
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.
Morty Proxy This is a proxified and sanitized view of the page, visit original site.