微信小程序之文本输出

和轮播图相似首先建立一个wtml

<view class=''>
      <text>文本输出:</text>
      <block wx:for="{{custom_data}}" wx:key="*this"> 
      <text>{{item.notification}}</text>
      </block> 
</view>

接下来是js,

wx.request({ // 获取后台输入的文本
      url: ,
      data: {
        custom_server:,
      },
      success: function (res) {
        let arr=res.data;
        var data=arr.data;
        that.setData({
          custom_data: data,
        });

      }
    })

后台PHPSQL查找文本内容

 $config=M('info')->find();
 $arr['notification']=$config['notification'];

前台HTML的输入略过,notification 是输入文本

转载于:https://www.cnblogs.com/luosong3/p/10564611.html

要在微信小程序实现文本流式输出,可以使用`wx.createSelectorQuery()`方法获取到文本输出区域的节点,然后使用`wx.getComputedStyle()`方法获取该节点的样式信息,包括宽度、字体大小等,根据这些信息计算出一行可以容纳的最大文字数量,然后将要输出文本逐个字符地输出到页面中,当达到一行的最大字数时,自动换行并继续输出下一行的文字。 以下是一个简单的示例代码: ```javascript Page({ data: { text: '这是要输出文本,可以很长很长。' }, outputText: function() { var that = this; wx.createSelectorQuery().select('.output-area').boundingClientRect(function(rect) { var lineHeight = parseInt(wx.getComputedStyle(that, '.output-area')['line-height']); var maxWidth = rect.width; var fontSize = parseInt(wx.getComputedStyle(that, '.output-area')['font-size']); var maxTextWidth = parseInt(maxWidth / fontSize); // 每行最多容纳的文字数量 var text = that.data.text; var output = ''; while (text.length > 0) { var lineText = text.substr(0, maxTextWidth); text = text.substr(maxTextWidth); output += lineText + '\n'; } that.setData({ outputText: output }); }).exec(); } }) ``` 其中,`output-area`是文本输出区域的类名,可以根据实际情况进行修改。在`outputText()`方法中,首先使用`wx.createSelectorQuery()`方法获取到输出区域的节点信息,然后使用`wx.getComputedStyle()`方法获取该节点的样式信息,包括宽度、字体大小等。接着,计算出一行可以容纳的最大文字数量`maxTextWidth`,并将要输出文本逐个字符地输出到页面中,当达到一行的最大字数时,自动换行并继续输出下一行的文字。最后,将输出文本赋值给`outputText`变量,用于在页面中显示。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值