Open haydarai opened 7 years ago
Hi @haydarai , thanks for using vue-at. Currently vue-at only supports contenteditable, textarea is not yet implemented.
I'm interested in the feature. Any PR is appreciated too.
Is this something near to the top of your 'To do list'? Would be very useful.
@fritx is this something you can do?
Yeah, I wanted to have this feature. Looks like just some api modification.
But I was not very free yet. Would be great to see some work on this too.
@haydarai @alex-bowers @jbrooksuk hey guys
textarea feature is out with 2.2.0 2.2.1, please try 😃
usage:
<template>
<at-textarea>
<textarea></textarea>
</at-textarea>
</template>
<script>
// import At from 'vue-at' // for content-editable
import AtTextarea from 'vue-at/dist/vue-at-textarea' // for textarea
export default {
components: { AtTextarea }
}
</script>
npm i -S textarea-caret # also, for textarea
@fritx
Just a clarification ... does this use the same attributes and slots as <at>
?
For example, can I do this ?? :
<template>
<at-textarea :members="members" >
<template slot="item" scope="s">
<span v-text="s.item"></span>
</template>
<textarea></textarea>
</at-textarea>
</template>
Answer: Yes!
@nocrates yes, if you had any problem, let me know. Btw, a live-demo and documentation is coming soon~~
@fritx Is there a way to make it work with input instead of textarea? Thanks.
@pingshunhuangalex hmm that would be another feature request. Could you replace your input just with a one-row textarea or not?
Btw, the brand new documentation is out: https://fritx.github.io/vue-at
Thanks for the adding the textarea option. However, two issues:
When using v-model on the textarea, the model is not updated when an option is selected, but on the next keystroke. This can lead to incomplete information.
A trailing space is added when an option is selected. Can this behavior be removed? Perhaps through an option?
@seanodotcom nice to have your suggestion.
Did you put v-model
on the <at-ta>
instead of <textarea>
as documented? -- https://fritx.github.io/vue-at/#/en/vmodel
There is a prop suffix
but not yet documented which defaults to be ' '
-- https://github.com/fritx/vue-at/blob/dev/src/At.vue#L25-L28, give it a try: <at-ta suffix="">
Not work v-model . After the message seanodotcom nothing has changed
<template>
<at-ta :members="members" name-key="value" v-model="text">
<template slot="item" slot-scope="s">
<span v-text="s.item.name"></span>
</template>
<textarea style="width: 100%" ></textarea>
</at-ta>
</template>
@ZavilenskyIlya is text
in your data
section?
@fritx Yes
npm i -S textarea-caret
You need to put this in docs!!! I was searching for a while. It works know :))
@hazanncv yes thanks for the suggestion! It is already documented in the "Textarea" section of Readme but it is unobvious indeed.
When I try to use this example with
<div class="editor" contenteditable></div>
:It works just fine, but when I change it to use
textArea
, it didn't work at all. Is there any way I can usevue-at
withtextarea
?