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

[Question] directives:v-model or vModel?v-show or vShow? #703

Open
lilijh opened this issue Apr 12, 2024 · 1 comment
Open

[Question] directives:v-model or vModel?v-show or vShow? #703

lilijh opened this issue Apr 12, 2024 · 1 comment
Labels
good first issue Good for newcomers

Comments

@lilijh
Copy link

lilijh commented Apr 12, 2024

🧐 Problem Description

I tried to use v-model in vue jsx,according to the doc,I used v-model to bind a value to an input element,and it worked as expected.
Howerve,I found that it can also be written in the form of vModel,which works the same way.
I searched many places and didn't find this form.I want to konw why this form is not in the doc.

💻 Sample code

live demo

<script setup lang="tsx">

import { ref,reactive } from 'vue';

const val = ref(1)

const isShow = ref(true)

const TestComponent = () => (
  <div>
    in script:<input vShow={isShow.value} vModel={val.value}/>
  </div>
)
</script>

<template>
  <div class="demo">
    <TestComponent />
    <div>in template:<input v-model="val" /></div>
    <div>val:{{ val }}</div>
    <button @click="isShow = !isShow">change visibility</button>
    <button @click="val++">click</button>
  </div>
</template>

🚑 Other information

@lilijh lilijh added the question Further information is requested label Apr 12, 2024
@sxzz
Copy link
Member

sxzz commented May 26, 2024

Both methods work. Feel free to send a PR about docs.

@sxzz sxzz added good first issue Good for newcomers and removed question Further information is requested labels May 26, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
good first issue Good for newcomers
Projects
None yet
Development

No branches or pull requests

2 participants