小程式中實現一鍵複製長段文字內容
阿新 • • 發佈:2022-05-03
做小程式開發,就知道其實小程式是有限制的,在小程式內無法開啟網址,只允許從一個小程式跳到另一個小程式。
今天主要不是說小程式的限制,我們來看一下,如果網址不能開啟的情況下,能否給使用者提供“一鍵複製”功能?
必須可以,微信提供了複製的API,如下:
wx.setClipboardData({
data: url,
success: function (res) {
util.showModelTips('複製成功');
}
})
我們來看一下“一鍵複製”的使用場景~
一、複製全部內容(今天要說的重點)
例項一:複製網址
這個就是上面說的例子,就不詳細介紹了
例項二:複製全部文字
這種情況也有,就是想複製一段內容出來。做法是監聽長按事件bindlongtap,然後觸發彈層,點選彈層,觸發“複製程式碼”~
例項三:複製所有內容,用微信通用選單形式展示
看了小程式的API,其實也提供了showActionSheet方法,可以把選單做的更像微信原生選單,效果圖和程式碼如下:
wx.showActionSheet({ itemList: ['複製內容', '上傳背景圖片'], success: function (res) { console.log(res.tapIndex) }, fail: function (res) { console.log(res.errMsg) } })
二、複製部分文字內容
小程式API也提供了選擇複製,就是使用text標籤,設定selectable="true",並且必須是text標籤,如下:
<text class="c-desc" selectable="true">{{detail.desc}}</text>
OK,今天就分享到這兒~