微信小程序开发几个细节:

1.界面传值

①全局参数传值

    <!--结果-->
<view wx:for="{{data}}" class="case pr">
<image class="pic" src="http://www.jinhuang.com{{item.Thumbnails}}" mode="aspectFill" data-Type="{{item.Type}}" data-Style="{{item.Style}}" data-Area="{{item.Area}}" data-gid="{{item.ID}}" data-src="http://www.jinhuang.com{{item.Thumbnails}}" bindtap="goToDetaile"></image>
<view class="title ellipsis">{{item.Title}}</view>
<view class="tag ellipsis">{{item.Type}} | {{item.Area}} | {{item.Style}}</view>
<view class="headPic pa" bindtap="goToDesigner" data-did="{{item.ID}}">
<image src="{{item.ID}}"></image>
<text class="ellipsis tc"></text>
</view>
</view> 通过绑定触发事件到:goToDetaile var app=getApp();
//跳转案例详情
goToDetaile:function(event){
app.globalData.caseId =event.currentTarget.dataset.gid;
app.globalData.data = event.currentTarget.dataset;
wx.navigateTo({
url: '../detaile/detaile'
});
},

  

②界面传值

      <view class="item-view" wx:for="{{videoDataList}}"  wx:for-item="item" wx:key="item.ID">
<navigator url="detaile/detaile?id={{item.ID}}">
<template is="mainTabCell" data="{{item}}" />
</navigator>
</view> 跳转到详情页面:
在触发OnLoad事件时候传入options值
onLoad: function (options) {
//初始化数据
this.getData(options);
},
//加载数据
getData: function (callback) {
var self = this;
wx.showToast({
title: '加载中...',
icon: 'loading',
duration: 10000
});
wx.request({
url: "https://0to9.top/api/article/" + callback.id,
header: {
'Content-Type': 'application/json'
},
success: function (res) { WxParse.wxParse('article', 'html', res.data.Data.Content, self, 5);
self.setData({
data: res.data.Data
});
wx.hideToast();
}
})
},

  

2.请求数据

    wx.request({
url: "https://0to9.top/api/article/" + callback.id,
header: {
'Content-Type': 'application/json'
},
success: function (res) { WxParse.wxParse('article', 'html', res.data.Data.Content, self, 5);
self.setData({
data: res.data.Data
});
wx.hideToast();
}

  

3.全局值使用,当前页面值使用

        app.globalData.caseId =event.currentTarget.dataset.gid;

4.HTML数据展示

<import src="../../../wxParse/wxParse.wxml" />

<view class="detaile bg_f mt35 border_t border_b">
<view class="content w mt40 border_t">
<view class="wxParse">
<template is="wxParse" data="{{wxParseData:article.nodes}}" />
</view> </view>
</view> onLoad: function (options) {
//初始化数据
this.getData(options);
},
//加载数据
getData: function (callback) {
var self = this;
wx.showToast({
title: '加载中...',
icon: 'loading',
duration: 10000
});
wx.request({
url: "https://0to9.top/api/article/" + callback.id,
header: {
'Content-Type': 'application/json'
},
success: function (res) { WxParse.wxParse('article', 'html', res.data.Data.Content, self, 5);
self.setData({
data: res.data.Data
});
wx.hideToast();
}
})
},

  载入js,转换文本内容成json格式,在展示层通过模板绑定数据。

5.https,ssl2.0问题解决

https:https://www.pianyissl.com/  免费3个月https证书,在iis中导入证书绑定即可。

ssl2.0 :下载 tls 1.2.reg  ,直接电脑双击使用

6.关于MVVM模式研究(开元装饰demo)

微信小程序细节的更多相关文章

  1. 微信小程序资源整理

    微信小程序相关的文档.教程.开源项目等资源的整理,以便于开发学习使用. —— —— 收录仅作个人学习使用,涉及侵权行为及时联系: maple_6392@163.com 项目地址:GitHub | 码云 ...

  2. 快速了解微信小程序的使用,一个根据小程序的框架开发的todos app

    微信官方已经开放微信小程序的官方文档和开发者工具.前两天都是在看相关的新闻来了解小程序该如何开发,这两天官方的文档出来之后,赶紧翻看了几眼,重点了解了一下文档中框架与组件这两个部分,然后根据简易教程, ...

  3. 微信小程序教程汇总

    目前市面上在内测期间出来的一些实战类教程还是很不错的,主要还是去快速学习小程序开发的整体流程,一个组件一个组件的讲的很可能微信小程序一升级,这个组件就变了,事实本就如此,谁让现在是内测呢.我们不怕,下 ...

  4. 微信小程序常见问题集合(长期更新)

    最新更新: 新手跳坑系列:推荐阅读:<二十四>request:fail错误(含https解决方案)(真机预览问题 跳坑指南<七十>如何让微信小程序服务类目审核通过 跳坑六十九: ...

  5. 【腾讯Bugly干货分享】打造“微信小程序”组件化开发框架

    本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:http://mp.weixin.qq.com/s/2nQzsuqq7Avgs8wsRizUhw 作者:Gc ...

  6. 浅谈微信小程序对于创业者,意味着什么?

    尽管这个话题,有点儿烂大街,然而作为开发者兼创业人,兹以为很有必要为自己梳理一番. 多年前,当萌生创业的念头时,我是这样在脑海里绘制这幅蓝图的: 我需要一个域名,一个服务器,并且备了案. 我需要至少一 ...

  7. 微信小程序(应用号)资源汇总整理

    微信小应用资源汇总整理 开源项目 WeApp - 微信小程序版的微信 wechat-weapp-redux-todos - 微信小程序集成Redux实现的Todo list wechat-weapp- ...

  8. 国内首个微信小程序开发者社区www.mntuku.cn

    微信小程序开发者社区-微信小程序开发教程-微信小程序最新资讯 - www.mntuku.cn .本站作为专业的微信小程序开发者社区为大家提供:微信小程序开发者交流平台,微信小程序开发教程,微信小程序定 ...

  9. 微信小程序(应用号)开发资源汇总整理 - 一直更新中

    开源项目 wechat-weapp-gank - 微信小程序版Gank客户端 wechat-dribbble - 微信小程序-Dribbble wechatApp-demo - 微信小程序 DEMO ...

随机推荐

  1. nginx 日志详解及自定义日志配置

    nginx的log日志分为access log 和 error log 其中access log 记录了哪些用户,哪些页面以及用户浏览器.ip和其他的访问信息 error log 则是记录服务器错误日 ...

  2. itextsharp利用模板生成pdf文件笔记

    iTextSharp是一款开源的PDF操作类库,使用它可以快速的创建PDF文件. 中文参考网站:http://hardrock.cnblogs.com/ http://pdfhome.hope.com ...

  3. Unity shader学习之屏幕后期处理效果之Bloom效果

    Bloom特效是游戏中常见的一种屏幕效果.这种特效可以模拟真实摄像机的一种图像效果,它让画面中较亮的区域“扩散”到周围的区域中,造成一种朦胧的效果. Bloom的实现原理很简单,首先根据一个阈值提取出 ...

  4. ps 证件照(1,2寸)

    制作证件照      9*9打印 1,1寸  图片裁剪 2, 2寸 图片裁剪 3,将裁剪完成后的图片选择添加画布  Alt Ctrl  c 将高和宽各加20px  ,背景选择白色 4,将得到的带有白色 ...

  5. Vue系列之 => 组件中的data和methods

    使用data <!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  6. 键值对Dictionary、KeyValuePair、Hashtable 简单使用。

    KeyValuePair是单个的键值对对象.KeyValuePair可用于接收combox选定的值. 例如:KeyValuePair<string, object> par = (KeyV ...

  7. 【转】通过Excel生成批量SQL语句,处理大量数据

    经常会遇到这样的要求:用户给发过来一些数据,要我们直接给存放到数据库里面,有的是Insert,有的是Update等等,少量的数据我们可以采取最原始的办法,也就是在SQL里面用Insert into来实 ...

  8. ASP.NET界面重定向传值

    这么说吧,当程序启动时,ASP.NET会自动创建一些经常使用的类的实例,而这些实例就是ASP.NET的内置对象,常用的实例对象有:Response(来自HttpResponse类).Request(来 ...

  9. 【Hbase学习之三】Hbase Java API

    环境 虚拟机:VMware 10 Linux版本:CentOS-6.5-x86_64 客户端:Xshell4 FTP:Xftp4 jdk8 hadoop-2.6.5 hbase-0.98.12.1-h ...

  10. Tomcat JAR包冲突报错

    查看Tomcat下有两个PDF加密的jar包如图: 删除这个bcprov-jdk14-138.jar包,然后重启Tomcat就好了. 这个jar包和Tomcat中的一个包冲突,反复调用导致的. 参考: ...