开始

官方文档,多行文本组件。
https://uniapp.dcloud.io/component/textarea.html
image.png

image.png

image.png

image.png
加一个边框
image.png

  1. textarea{
  2. border: 1upx solid
  3. }

image.png
在外面嵌套一个view。官方有这样一个写好的样式。
image.png

  1. <view class="uni-textarea">
  2. <textarea value="" placeholder="说一句话吧~" />
  3. </view>

image.png

image.png

image.png

image.png

绑定值

image.png
定义属性
image.png

  1. data() {
  2. return {
  3. yinsi: "所有人可见",
  4. text: ""
  5. }
  6. },

加一个初始值
image.png

image.png
显示输入的值
image.png

  1. <view class="uni-textarea">
  2. <textarea value="" v-model="text" placeholder="说一句话吧~" />
  3. </view>
  4. <view class="">
  5. 文本框输入内容为: {{ text }}
  6. </view>

image.png

image.png

结束