Skip to content
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

Unquote numeric properties for Vue (if it's indeed safe to do that) #10127

Open
thorn0 opened this issue Jan 25, 2021 · 1 comment
Open

Unquote numeric properties for Vue (if it's indeed safe to do that) #10127

thorn0 opened this issue Jan 25, 2021 · 1 comment
Labels
lang:vue Issues affecting Vue status:needs investigation Issues that need additional investigation, e.g. to understand whether the reported behavior is a bug

Comments

@thorn0
Copy link
Member

thorn0 commented Jan 25, 2021

Unquoted numeric property names seem to be supported in Vue expressions.
But first, before fixing this, it'd be good to find some solid confirmation that it's 100% safe to do that.

Prettier 2.2.1
Playground link

--parser vue

Input:

<template>
  <div id="app">
    <HelloWorld :msg="{ '0': 'Hello Vue!' }[0]"/>
  </div>
</template>

Output:

<template>
  <div id="app">
    <HelloWorld :msg="{ '0': 'Hello Vue!' }[0]" />
  </div>
</template>

Expected (?):

<template>
  <div id="app">
    <HelloWorld :msg="{ 0: 'Hello Vue!' }[0]"/>
  </div>
</template>
@thorn0 thorn0 added lang:vue Issues affecting Vue status:needs investigation Issues that need additional investigation, e.g. to understand whether the reported behavior is a bug labels Jan 25, 2021
@fisker
Copy link
Member

fisker commented Jan 25, 2021

I wonder if this breaks the HelloWorld component, if it's msg prop is defined in Typescript,

<template>
  <div id="app">
    <HelloWorld :object="{ '0': 'Hello Vue!' }"/>
  </div>
</template>


<!--- HelloWorld Component -->
<template>
  <div>
    {{object[0]}}
    {{object["0"]}}
  </div>
</template>

<script lang="typescript">
export default {
  prop: {
    object: // Type info here?
  }
}
</script>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
lang:vue Issues affecting Vue status:needs investigation Issues that need additional investigation, e.g. to understand whether the reported behavior is a bug
Projects
None yet
Development

No branches or pull requests

2 participants