> 위챗 애플릿 > 미니 프로그램 개발 > 미니 프로그램에서 서식 있는 텍스트 편집에 어떻게 접근하나요?

미니 프로그램에서 서식 있는 텍스트 편집에 어떻게 접근하나요?

青灯夜游
풀어 주다: 2021-04-26 08:55:20
앞으로
3422명이 탐색했습니다.

미니 프로그램을 리치 텍스트 편집에 어떻게 연결하나요? 다음 기사에서는 이를 소개합니다. 도움이 필요한 친구들이 모두 참고할 수 있기를 바랍니다.

미니 프로그램에서 서식 있는 텍스트 편집에 어떻게 접근하나요?

WeChat 미니 프로그램 등의 경우 활동 설명, 소개 등의 그래픽 소개 페이지에서는 일반적으로 배경이 서식 있는 텍스트 편집 상자로 구성되며, 내용이 배경에서 직접 입력되어 화면에 표시됩니다. 미니 프로그램 인터페이스. 그런데 리치 텍스트 편집으로 추출한 내용은 html 형식이고, 작성 방식도 미니 프로그램의 wxml과 일치하지 않습니다. 그렇다면 어떻게 리치 텍스트를 미니 프로그램 페이지에 표시할 수 있을까요?

한 전문가가 미니 프로그램에 바로 도입해 사용할 수 있는 wxParse라는 템플릿을 개발했습니다.

미니 프로그램에서 서식 있는 텍스트 편집에 어떻게 접근하나요?

소개 및 사용 방법

page{
width: 100%;
height: 100%;
background: #e4382e;
overflow: auto;
}
로그인 후 복사

.js 코드:

const app = getApp()
//引入wxParse var WxParse = require(\'../../../components/wxParse/wxParse.js\');
Page({
/**
* 页面的初始数据
*/
data: {
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
wx.showLoading({
title: \'加载中\',
mask: true
})
var that = this;
console.log(options)
that.setData({
activityId: options.activityId
})
wx.request({
url: app.globalData.subDomain + \'/GetActivityInfo\',    
data: {
token: app.globalData.token,
activity: that.data.activityId
},
method: \'POST\',
success: function(res){
//获取html代码             
WxParse.wxParse(\'article\', \'html\', that.data.article, that, 5);
wx.hideLoading();
}
})
}
로그인 후 복사

js 부분에서 주의할 점이 두 가지 있습니다:

첫 번째 포인트는 페이지 기능 이전에 wxParse를 도입하는 것입니다

두 번째 포인트는 html을 얻은 후 실행

WxParse.wxParse(\'article\', \'html\', that.data.article, that, 5)
로그인 후 복사

이 기사는 얻은 html 코드입니다

이런 종류의 컴포넌트 작성 방법은 여전히 ​​​​작은 프로그램을 작성하는 구식 방법입니다. 새 버전의 작은 프로그램에서는 지금과 다를지 모르겠습니다. 이 플러그인 개발자도 나중에 최신 방법으로 전환할 예정인가요? 즉, 미니 프로그램은 여전히 ​​이 쓰기 방법을 지원합니다.

추천: "Mini 프로그램 개발 튜토리얼"

위 내용은 미니 프로그램에서 서식 있는 텍스트 편집에 어떻게 접근하나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

관련 라벨:
원천:csdn.net
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
최신 이슈
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿