微信小程序细节
微信小程序开发几个细节:
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)
微信小程序细节的更多相关文章
- 微信小程序资源整理
微信小程序相关的文档.教程.开源项目等资源的整理,以便于开发学习使用. —— —— 收录仅作个人学习使用,涉及侵权行为及时联系: maple_6392@163.com 项目地址:GitHub | 码云 ...
- 快速了解微信小程序的使用,一个根据小程序的框架开发的todos app
微信官方已经开放微信小程序的官方文档和开发者工具.前两天都是在看相关的新闻来了解小程序该如何开发,这两天官方的文档出来之后,赶紧翻看了几眼,重点了解了一下文档中框架与组件这两个部分,然后根据简易教程, ...
- 微信小程序教程汇总
目前市面上在内测期间出来的一些实战类教程还是很不错的,主要还是去快速学习小程序开发的整体流程,一个组件一个组件的讲的很可能微信小程序一升级,这个组件就变了,事实本就如此,谁让现在是内测呢.我们不怕,下 ...
- 微信小程序常见问题集合(长期更新)
最新更新: 新手跳坑系列:推荐阅读:<二十四>request:fail错误(含https解决方案)(真机预览问题 跳坑指南<七十>如何让微信小程序服务类目审核通过 跳坑六十九: ...
- 【腾讯Bugly干货分享】打造“微信小程序”组件化开发框架
本文来自于腾讯Bugly公众号(weixinBugly),未经作者同意,请勿转载,原文地址:http://mp.weixin.qq.com/s/2nQzsuqq7Avgs8wsRizUhw 作者:Gc ...
- 浅谈微信小程序对于创业者,意味着什么?
尽管这个话题,有点儿烂大街,然而作为开发者兼创业人,兹以为很有必要为自己梳理一番. 多年前,当萌生创业的念头时,我是这样在脑海里绘制这幅蓝图的: 我需要一个域名,一个服务器,并且备了案. 我需要至少一 ...
- 微信小程序(应用号)资源汇总整理
微信小应用资源汇总整理 开源项目 WeApp - 微信小程序版的微信 wechat-weapp-redux-todos - 微信小程序集成Redux实现的Todo list wechat-weapp- ...
- 国内首个微信小程序开发者社区www.mntuku.cn
微信小程序开发者社区-微信小程序开发教程-微信小程序最新资讯 - www.mntuku.cn .本站作为专业的微信小程序开发者社区为大家提供:微信小程序开发者交流平台,微信小程序开发教程,微信小程序定 ...
- 微信小程序(应用号)开发资源汇总整理 - 一直更新中
开源项目 wechat-weapp-gank - 微信小程序版Gank客户端 wechat-dribbble - 微信小程序-Dribbble wechatApp-demo - 微信小程序 DEMO ...
随机推荐
- LeetCode168.Excel表列名称
给定一个正整数,返回它在 Excel 表中相对应的列名称. 例如, 1 -> A 2 -> B 3 -> C ... 26 -> Z 27 -> AA 28 -> ...
- mysql基础常用命令
数据库 1查询 Select * From table select host,user,password from mysql.user where user='ybb' and host='%'; ...
- jQuery-表格属性
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 强化学习--Policy Gradient
Policy Gradient综述: Policy Gradient,通过学习当前环境,直接给出要输出的动作的概率值. Policy Gradient 不是单步更新,只能等玩完一个epoch,再 ...
- sql server得到某个数据库的所有表和所有字段
select b.name tablename,a.name as columnnamefrom sys.columns a,sys.objects b,sys.types cwhere a.obje ...
- javascript(一):javascript基本介绍及基本语法
什么是javascript? javascript是一种直译型脚本语言,是一种动态类型.弱类型.基于原型的语言.(所谓“脚本语言”:指的是它不具有开发操作系统的能力,只是用来编写大型运用程序的脚本!) ...
- video control
function VideoControls(option){ this.id = option.videoId; this.videoId = document.getElementsByTagNa ...
- 开源词袋模型DBow3原理&源码(一)整体结构
前人摘树,后人乘凉. 源码在github有CMakeLists,代码下下来可以直接编译. 泡泡机器人有个很详细的分析,结合浅谈回环检测中的词袋模型,配合高翔的回环检测应用,基本上就可以串起来了. tf ...
- (Review cs231n) The Gradient Calculation of Neural Network
前言:牵扯到较多的数学问题 原始的评分函数: 两层神经网络,经过一个激活函数: 如图所示,中间隐藏层的个数的各数为超参数: 和SVM,一个单独的线性分类器需要处理不同朝向的汽车,但是它并不能处理不同颜 ...
- Linux基础命令---显示登录用户w
w 显示哪些用户登录,并且显示用户在干什么.报头按此顺序显示当前时间.系统运行时间.当前登录用户数以及过去1.5和15分钟的系统平均负载.接着为每个用户显示以下条目:登录名.TTY名称.远程主机.登录 ...