小程序遇到的一些问题

最新推荐文章于 2023-07-13 12:05:06 发布

改个名字888777

最新推荐文章于 2023-07-13 12:05:06 发布

阅读量198

点赞数

分类专栏：杂

本文链接：https://blog.csdn.net/Lakeson/article/details/114333260

版权

杂专栏收录该内容

10 篇文章 0 订阅

订阅专栏

1. rich-text 不识别换行符

2. 自定义小程序导航栏

3. h5跳小程序

1. rich-text 不识别换行符

		getEnterSymbol(content){
			if(content.trim() != ''){
				return content.split('\n').reduce((total, cur) => total += `<p>${cur}</p>`)
			}else{
				return ''
			}
		}

2. 自定义小程序导航栏

细节如下：

json文件里"navigationStyle" 设置为 "custom"

但是每个手机型号的系统信息不同，所以样式的设置需通过如下计算得到：

Object wx.getMenuButtonBoundingClientRect() 获取菜单按钮（右上角胶囊按钮）的布局位置信息

wx.getSystemInfo(Object object) 获取系统信息。

onLaunch: function () {
    let menuButtonObject = wx.getMenuButtonBoundingClientRect();
    wx.getSystemInfo({
      success: res => {
        let statusBarHeight = res.statusBarHeight,
          navTop = menuButtonObject.top,//胶囊按钮与顶部的距离
          navHeight = statusBarHeight + menuButtonObject.height + (menuButtonObject.top -         statusBarHeight)*2;//导航高度
        this.globalData.navHeight = navHeight;
        this.globalData.navTop = navTop;
        this.globalData.windowHeight = res.windowHeight;
      },
      fail(err) {
        console.log(err);
      }
    })
  }

3. h5跳小程序

// 动态渲染微信开发标签跳转小程序

配置wxconfig：wx-open-launch-weapp。

注意：图片地址不能是本地图片

 <div v-html="renderDom('查看XXX')" class="jump-box"></div>

renderDom (item) {

let script = document.createElement('script')

script.type = 'text/wxtag-template'

script.text = `<div style="text-align:center;margin-bottom: 29px;height: 19px;line-height: 19px;"><span style="font-weight: 500;color: #FFCFAA;font-size: 13px;">${item}</span> <img style="width: 7px;height: 12px;display: inline-block;margin-left: 4px;" src="https://xxxxx.png" </div>`

let html = `<wx-open-launch-weapp style="width:100%;display:block;height:100%;" username="gh_xxxxx"path="pages/index/index.html">${script.outerHTML}</wx-open-launch-weapp>`

return html

},