整合營(yíng)銷服務(wù)商
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
電腦端+手機(jī)端+微信端=數(shù)據(jù)同步管理
免費(fèi)咨詢熱線：
言：在實(shí)際開發(fā)項(xiàng)目中遇到在微信小程序里需要顯示新聞內(nèi)容，新聞內(nèi)容是通過接口讀取的服務(wù)器中的富文本內(nèi)容，是html格式的，小程序默認(rèn)是不支持html格式的內(nèi)容顯示的，那我們需要顯示html內(nèi)容的時(shí)候，就可以通過以下三種方式來進(jìn)行數(shù)據(jù)渲染。
文檔地址：https://developers.weixin.qq.com/miniprogram/dev/component/rich-text.html
使用方法：
1、在page.js中將從接口中獲取的值傳給content
Page({
data: {
content:''
},
onLoad: function () {
var that = this;
wx.request({
url: '',
method: 'POST',
data: {
'id':15
},
header: {
'content-type': 'application/json'
},
success: function(res) {
var content = res.data['content'];//對(duì)應(yīng)富文本編輯器的內(nèi)容
that.setData({
content:content
})
}
})
}
})2、在page.wxml中進(jìn)行數(shù)據(jù)輸出
<rich-text nodes="{{content}}" bindtap="tap"></rich-text>使用方法：
1、插件下載地址：https://github.com/icindy/wxParse
2、將下載后的文件夾放到小程序項(xiàng)目的根目錄
3、在需要加載html內(nèi)容的頁面對(duì)應(yīng)的js文件里引入wxParse
var WxParse = require('../../wxParse/wxParse.js');4、通過調(diào)用WxParse.wxParse方法來設(shè)置html內(nèi)容
/**
* WxParse.wxParse(bindName , type, data, target,imagePadding)
* 1.bindName綁定的數(shù)據(jù)名(必填)
* 2.type可以為html或者md(必填)
* 3.data為傳入的具體數(shù)據(jù)(必填)
* 4.target為Page對(duì)象,一般為this(必填)
* 5.imagePadding為當(dāng)圖片自適應(yīng)是左右的單一padding(默認(rèn)為0,可選)
*/
Page({
data: {
},
onLoad: function () {
var that = this;
wx.request({
url: '',
method: 'POST',
data: {
'id':15
},
header: {
'content-type': 'application/json'
},
success: function(res) {
var article = res.data['content'];
WxParse.wxParse('article', 'html', article, that,5);
}
})
}
})5、在頁面中引用模板
<!--放在底部-->
<import src="../../wxParse/wxParse.wxml"/>
<!--放在數(shù)據(jù)需要渲染的地方-->
<view class="wxParse">
<template is="wxParse" data="{{wxParseData:article.nodes}}"/>
</view> 6、這樣就配置完了，具體的樣式是可以通過css去自定義調(diào)整的
如果說直接使用文章詳情頁面，強(qiáng)烈建議直接加載外部網(wǎng)頁，這樣使用起來是去合理化的。
文檔地址：https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html
使用方法：
1、在所需頁面加載web-view標(biāo)簽，傳入外部訪問的路徑就可以了
<web-view bindload="finish" src="http://www.baidu.com"></web-view>需要注意的是個(gè)人版的微信小程序沒有這個(gè)功能，企業(yè)版的需要在控制臺(tái)中先配置相關(guān)的業(yè)務(wù)域名。
以上就是小程序開發(fā)過程中對(duì)富文本編輯器中html渲染的三種常用方法。
我是小程序軟件開發(fā)，每天分享開發(fā)過程中遇到的知識(shí)點(diǎn)，如果對(duì)你有幫助的話，幫忙點(diǎn)個(gè)贊再走唄，非常感謝。
《完》
往期文章分享：
php常用的富文本編輯器，ueditor和kindeditor
個(gè)搭建過程大約十分鐘就發(fā)布上線了，雖然，一直存在一些問題，“頁面iframe不支持引用非業(yè)務(wù)域名”，這是我網(wǎng)站形式造成的。
如果你是企業(yè)站或比較純粹的博客站等，沒有外部鏈接，那么，這個(gè)方法很適用。
那么，直接步入正題吧。
看看怎么用10分鐘就把自己網(wǎng)站轉(zhuǎn)換成微信小程序。
操作步驟：
1、申請(qǐng)SSL證書，轉(zhuǎn)https（不會(huì)的看下文，如果你用的是寶塔更簡(jiǎn)單，此文未介紹）。
網(wǎng)站防篡改全站http轉(zhuǎn)https完整流程
https://mp.weixin.qq.com/s?__biz=MzU4ODM5MDkyMg==&mid=2247484609&idx=1&sn=6f1baa81167e08037508a62b05e47764&chksm=fddc33a4caabbab214150f70ea1400317e4dbb4c9864dc1c2735c863cafe25b1e931cecdcd15&scene=21#wechat_redirect
2、申請(qǐng)注冊(cè)小程序賬號(hào)（此方法，個(gè)人注冊(cè)小程序不行，必須企業(yè)或組織的）
不會(huì)注冊(cè)的，注冊(cè)流程看這里。
https://jingyan.baidu.com/article/295430f13472ee4d7e0050e4.html
個(gè)人版后臺(tái)無此“業(yè)務(wù)域名”配置功能
在綁定“業(yè)務(wù)域名”時(shí)需上傳文件驗(yàn)證，所以登錄好服務(wù)器后臺(tái)或ftp工具。
3、小程序后臺(tái)配置好“服務(wù)器域名”及“業(yè)務(wù)域名”
4、下載微信開發(fā)者工具，找不到的看這里
https://jingyan.baidu.com/article/54b6b9c0d7ec6c6c583b47e4.html
5、安裝好之后，打開微信開發(fā)者工具，選擇小程序項(xiàng)目。點(diǎn)擊管理項(xiàng)目+號(hào)增加小程序。
6、桌面隨便新建個(gè)文件夾，小程序開發(fā)工具，選擇空白文件夾，并輸入AppID，不要使用云服務(wù)，點(diǎn)擊新建即可。
7、打開app.json文件，修改第9行“ ”內(nèi)文字為自己小程序名稱，之后保存。
8、打開路徑/pages/index/index.wxml文件，清空內(nèi)容。
9、將下面代碼粘貼進(jìn)去，修改為自己的域名，之后保存，可見左側(cè)網(wǎng)站已顯示出來。
<web-view src="https://www.zhibushi.com"></web-view>
10、之后直接點(diǎn)擊上傳即可。
ps:上傳之前可以先真機(jī)調(diào)試檢查下是否有如我這樣的問題。
11、最后，回到公眾號(hào)服務(wù)平臺(tái)提交審核即可，審核通過即可提交上線。
前面也說了，我的是因?yàn)榫W(wǎng)站性質(zhì)的問題，所以會(huì)不斷跳出“不支持非業(yè)務(wù)域名”，一般的企業(yè)站等不會(huì)有外部域名，也就不會(huì)出現(xiàn)這種問題，當(dāng)然，換了友鏈之類也會(huì)彈出提醒。
當(dāng)時(shí)做這個(gè)小程序，也是我第一次接觸小程序。本來只是拿來練手，只是希望能把網(wǎng)站轉(zhuǎn)成小程序，也能方便搜索訪問下載資源，但每打開一個(gè)頁面就要關(guān)閉下提醒的確有點(diǎn)煩。
后續(xù)也做過幾個(gè)不同類型的小程序，更熟悉了小程序的搭建，但上面的問題卻一直沒找到方法解決。除非網(wǎng)站重建或者重建小程序，但那樣就不是我當(dāng)建站的本意了。
這篇純教程，沒啥資源推薦，最近又補(bǔ)充了點(diǎn)新資源，需要就老地方自取！！
閩南網(wǎng)]
“微信朋友圈廣告年度評(píng)選活動(dòng)”目前正在火熱進(jìn)行。小編文章中為大家分享了朋友圈廣告年度評(píng)選活動(dòng)地址以及二維碼入口。想要參與這項(xiàng)活動(dòng)的用戶就進(jìn)入體驗(yàn)吧！
微信朋友圈廣告年度評(píng)選入口在哪
活動(dòng)入口：
微信打開下面鏈接https://mp.weixin.qq.com/promotion/res/htmledition/best-moments-2018/index.html
領(lǐng)取步驟：
隨便點(diǎn)擊一個(gè)或多個(gè)廣告投票，然后點(diǎn)擊下方的生成個(gè)人封面，如果提示有紅包就代表中了，沒有提示則沒有中。
用戶注意：
本文這個(gè)活動(dòng)是微信官方的，隨便給3個(gè)廣告投票后往下拉生成評(píng)委卡。
如果抽到紅包就會(huì)顯示金額。如果沒抽到就生成一個(gè)二維碼，紅包貌似不是秒到賬的。
再說是微信官方的應(yīng)該不會(huì)耍賴，多等會(huì)吧!
小編總結(jié)
微信朋友圈廣告年度評(píng)選入口已經(jīng)為大家?guī)怼８鶕?jù)以上方法就能進(jìn)入領(lǐng)取紅包。感興趣的用戶可以嘗試體驗(yàn)哦!
*請(qǐng)認(rèn)真填寫需求信息，我們會(huì)在24小時(shí)內(nèi)與您取得聯(lián)系。
