问题1:
在后台使用<textarea>
时,存入数据库没有问题,在编辑页面亦或是详情页,我们从数据库读取传入页面,绑定Vue.data
会出现因为 值有换行符而导致整个script
崩溃的问题
导致原因:
<textarea>中的换行符是\n
html中的换行符是<br/>
类似:
data:{
content : 'I
Love
you',
title:'it's a jok'
}
而js要求string字符串中不能有换行,上边这种情况就会导致页面崩溃
解决方法:
1:
放弃Vue的数据绑定
<div>
<pre><%-data.content%></pre>
</div>
用<pre>包裹,用<%-%>直接获取后台返回的数据
2:
后台从数据库拿到数据后,处理换行符,即将\n替换为<br/>,然后返回给页面
页面绑定Vue,用v-html渲染
注意事项:
当我们在编辑页渲染数据到页面时,要注意文本框内如果多出了很多空格和换行,那是因为
我们常写的html格式是
<div>
<textarea>
<%-data.content%>
</textarea>
</div>
需要注意的是div>textarea>数据之间的换行会被html解析
我们需要如此编写
<div><textarea><%-data.content%></textarea></div>