I have a profile filed in the user form as below. The issue I am facing here is when I enter text in this field like as below.
In the database, the text is saved with new line characters as shown below:
My Name is James Scott. I am a Software Developer.\nI live in New York.\nMy favourite programming language is Ruby and Python.
The issue is the text appears as a single line text. There is no new line for I live in New York. And My favourite programming language is Ruby and Python.
Please suggest me how I can resolve this issue. I am using VueJS on frontend and ruby on backend.
<v-form :model='user'>
<v-text-field id="profile"
ref="profile"
label="Detailed Profile"
name="user[profile]"
v-model='user.profile'
multi-line
required
class="input-element">
</v-text-field>
</v-form>
user.vue
<div id="user-profile">{{user.profile}}</div>
Change the content of the profile
inside computed
replacing the \n
with <br>
computed:{
profile:function(){
return this.user.profile.replace(/\n/g, '<br />');
}
}
and in template you can use it as html
content like this
<div id="user-profile" v-html="profile"></div>
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.