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

Problem Component Name: InputText Texttarea Primevue 4.2.5 #7016

Closed
palachX opened this issue Dec 26, 2024 · 4 comments
Closed

Problem Component Name: InputText Texttarea Primevue 4.2.5 #7016

palachX opened this issue Dec 26, 2024 · 4 comments
Labels
Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible

Comments

@palachX
Copy link

palachX commented Dec 26, 2024

Describe the bug

In version 3.51.0 u use update:modelValue and save reactivity
image

In version 4.2.5 u kill reactivity because u use this.writeValue
image

And i can't change value in input.

See this text in input don't change, but modelValue change:

image
image

Reproducer

https://stackblitz.com/edit/primevue-4-ts-vite-issue-template-9ubq2xzw?file=src%2FWorkComponent.vue

PrimeVue version

4.2.5

Vue version

4.x

Language

TypeScript

Build / Runtime

Vue CLI App

Browser(s)

Chrome 131.0.6778.205

Steps to reproduce the behavior

  1. Write clear component this code:
<script setup>
const [model] = defineModel({
   set(value) {
    return value.slice(0, 2)
  }
})
</script>

<template>
  <input type="text" v-model="model" />
</template>
  1. Use him in another component:
<script setup>
import { ref } from 'vue'
import MyComponent from './MyComponent.vue'
  
const myText = ref('')
</script>

<template>
  This input capitalizes everything you enter:
  <MyComponent v-model="myText" />
</template>

And use u InputText

  1. Write clear component this code:
<script setup>
import InputText from 'primevue/inputtext'

const [model] = defineModel({
  set(value) {
    return value.slice(0, 2)
  }
})
</script>

<template>
  <InputText  v-model="model" />
</template>
  1. Use him in another component:
<script setup>
import { ref } from 'vue'
import MyComponent from './MyComponent.vue'
  
const myText = ref('')
</script>

<template>
  This input capitalizes everything you enter:
  <MyComponent v-model="myText" />
</template>

Expected behavior

Value in InputText reactivity

@palachX palachX added the Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible label Dec 26, 2024
@palachX
Copy link
Author

palachX commented Dec 26, 2024

As it turned out, the problem has been found so far specifically with .slice(0, n), if you do return value + '_'; then it works, it's unclear why, but it seems to me that the problem is in the writeValue method.

image

@cagataycivici
Copy link
Member

PrimeVue 3.x has reached EOL by the end of 2024 so we're unable to assist.

@palachX
Copy link
Author

palachX commented Dec 27, 2024

Please see description, problem in version 4.2.5

PrimeVue version
4.2.5

@palachX palachX changed the title Component Name: InputText Problem Component Name: InputText Texttarea Primevue 4.2.5 Dec 27, 2024
@ZiadJ
Copy link

ZiadJ commented Dec 27, 2024

PrimeVue 3.x has reached EOL by the end of 2024 so we're unable to assist.

@cagataycivici It's a v4 issue actually and it involves both InputText and Textarea.
Notice how only native elements work as expected here:
https://stackblitz.com/edit/primevue-4-ts-vite-issue-template-qqzff9k4?file=src%2FMyComponent.vue

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Status: Needs Triage Issue will be reviewed by Core Team and a relevant label will be added as soon as possible
Projects
None yet
Development

No branches or pull requests

3 participants