原生微信小程序 textarea组件placeholder无法换行的问题解决办法

【问题描述】

微信小程序原生代码,使用文本域,placeholder使用\n 没有效果,网上找了一堆方案说使用
 也没有效果

最后在一个前端大佬博客,找到解决办法,CSS设置word-wrap: break-word; white-space: pre-line;

【解决办法】

  1. wxml
html 复制代码
    <textarea class="service-textarea" 
              placeholder="{{placeholderText}}" 
              value="{{serviceContent}}"
              bindinput="onServiceContentInput">
    </textarea>

2.js

javascript 复制代码
Page({
  data: {
     placeholderText: "家庭日常保洁\r\n\r\n1.服务内容\r\n2.收费说明\r\n\r\n我的个人履历可以查看主页,里面有我的培训证书和工作介绍。"

3.wxss

css 复制代码
textarea {
    word-wrap: break-word;
    white-space: pre-line;
}
相关推荐
计算机毕设定制辅导-无忧学长11 小时前
《基于微信小程序的居家医疗陪护预约系统设计与实现》
java·spring boot·微信小程序·uniapp·居家医疗陪护预约系统
wafrdggh19 小时前
2026 商城小程序平台哪个价格合理?把跨境附加成本这个坑算透
大数据·小程序
大数据技术派2 天前
我用AI写代码,做了3个小玩意儿
后端·微信小程序
律宏阔3 天前
Taro 4 项目从 npm 迁移到 pnpm 踩坑实录
前端·微信小程序·taro
恩创软件开发3 天前
自助KTV系统管理员续单功能
经验分享·小程序
多客:duokelijie3 天前
代练订单系统选型思路:跨品类游戏接入、订单分层管理、自动结算逻辑拆解!
数据库·mysql·微信小程序·前端框架·uni-app·php·持续部署
AI源码5 天前
在线考试小程序
小程序·notepad++
计算机毕设定制辅导-无忧学长5 天前
《基于微信小程序健康习惯激励系统设计与实现》
java·spring boot·mysql·微信小程序·uniapp·健康习惯激励系统
2501_916008895 天前
iPhone 设备信息查看,用 KeyMob 看型号、序列号、电池健康和 UDID
android·ios·小程序·https·uni-app·iphone·webview
拖孩6 天前
流量主门槛从 500 降到 100,我的小程序上线 18 小时够到了线
前端·后端·微信小程序