文章详情

短信预约-IT技能 免费直播动态提醒

请输入下面的图形验证码

提交验证

短信预约提醒成功

微信小程序中如何解决show内容展示以及上传文件编码问题

2024-04-02 19:55

关注

这篇文章主要介绍了微信小程序中如何解决show内容展示以及上传文件编码问题,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

show内容展示

尝试用微信小程序的template组件实现。同时,尝试页面间转跳时传参,在目标页面引入模板文件实现 写的更少,做的更多 篇幅有限详细代码此处省略

  <view class="show-warp">
    <block wx:for="{{discuss}}" wx:key="index">
      <template is="discuss" data="{{item}}"></template>
      <template is="discuss-reply" data="{{item}}"></template>
      <template is="discuss-more" data="{{item}}"></template>
    </block>
  </view>
  Page({
    data: {
      discuss: [],
      petAge: 0,
      reply: false,
      height: 20
    },
    onLoad: function(){
      util.dataList.call(this, {
        cb: util.petAge
      });
    }  
  });
  
  function list(option) {
    var opt = {
      url: option.url || 'https://api.zg5v.com/index.php/index/show/showindex',
      data: option.data || {
        uid: 148,
        num: option.pageNum || 0
      },
      update: option.update || false,
      cb: option.cb || false,
      func: option.func || false
    };
    // 数据列表
    var showList = [];
    var objDa = [];
    this.data.replyListArr = [];
    // 保存/修改 this指向
    var self = this;
    ajax({
      url: opt.url,
      data: opt.data,
      cb: function(res) {
        showList = res.data.data;
        // 统一格式
        if (!Array.isArray(showList) &&
          typeof showList === 'object') {
          // 计算评论发布时间
          showList.pl.forEach(function(e, i) {
            e.cp_chongbirth = e.cp_addtime * 1000;
            e.replyTime = opt.cb(e.cp_chongbirth, true);
          }, showList.pl);
          objDa.push(showList);
        } else {
          objDa = showList;
        }
        // 更新评论列表
        if (opt.update) {
          let da = res.data.data.pl,
            plDa = self.data.discuss,
            i = 0,
            j = 0,
            len = da.length,
            jLen = plDa.length;
          for (; j < jLen; j++) {
            for (; i < len; i++) {
              if (plDa[j].pl.length > 0) {
                plDa[j].pl.push(da[i]);
              }
            }
          }
          objDa = plDa;
          opt.update = !opt.update;
        }
        if (res.data.status === 1) {
          for (var i = 0, len = objDa.length; i < len; i++) {
            if (opt.cb && typeof opt.cb === 'function') {
              // 计算宠物年龄
              objDa[i].petAge = opt.cb(objDa[i].cp_chongbir ||
                objDa[i].cp_chongbirth);
            }
          }
          self.setData({
            discuss: objDa
          });
        } else if (res.data.status === 2 || res.data.status === 0) {
          self.onLoad();
        }
        objDa = [];
      }
    });
  }

上传文件编码问题(*)

header 里的数据在真机预览的时候是无效的。那就尝试改变编码进行传输,在uploadFile 的参数中加入

header: {“chartset”:”utf-8”}

或是

header: {"content-type":'application/x-www-form-urlencoded'}

需要改到 formData 中,尝试将编码数据加入formData,但仅仅传输了数据,并没有改变编码.header有问题暂时找不到解决方案,所以编码操作暂时只能手动进行.在javascript 中,字符串编码函数是 encodeURI, 在小程序中尝试可以使用。所以,将代码改为如下: 

  wx.uploadFile({
    url: 'Upload image server path (Must be secure https)',
    // 待上传的图片,由 chooseImage获得
    filePath: tempFilePaths[0],
    name: 'file',
    // HTTP 请求中其他额外的 form data
    formData: {
      // city: '太原',
      city: encodeURI('太原'),
      // name: 'taiyan',
      name: encodeURI('taiyan') // 名称
    }, 
    success: function(res) {
      console.log("success", res);
    },
    fail: function(res) {
      console.log("fail", res);
    }
  });

感谢你能够认真阅读完这篇文章,希望小编分享的“微信小程序中如何解决show内容展示以及上传文件编码问题”这篇文章对大家有帮助,同时也希望大家多多支持编程网,关注编程网行业资讯频道,更多相关知识等着你来学习!

阅读原文内容投诉

免责声明:

① 本站未注明“稿件来源”的信息均来自网络整理。其文字、图片和音视频稿件的所属权归原作者所有。本站收集整理出于非商业性的教育和科研之目的,并不意味着本站赞同其观点或证实其内容的真实性。仅作为临时的测试数据,供内部测试之用。本站并未授权任何人以任何方式主动获取本站任何信息。

② 本站未注明“稿件来源”的临时测试数据将在测试完成后最终做删除处理。有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341

软考中级精品资料免费领

  • 历年真题答案解析
  • 备考技巧名师总结
  • 高频考点精准押题
  • 2024年上半年信息系统项目管理师第二批次真题及答案解析(完整版)

    难度     813人已做
    查看
  • 【考后总结】2024年5月26日信息系统项目管理师第2批次考情分析

    难度     354人已做
    查看
  • 【考后总结】2024年5月25日信息系统项目管理师第1批次考情分析

    难度     318人已做
    查看
  • 2024年上半年软考高项第一、二批次真题考点汇总(完整版)

    难度     435人已做
    查看
  • 2024年上半年系统架构设计师考试综合知识真题

    难度     224人已做
    查看

相关文章

发现更多好内容

猜你喜欢

AI推送时光机
位置:首页-资讯-前端开发
咦!没有更多了?去看看其它编程学习网 内容吧
首页课程
资料下载
问答资讯