小程序教程第4页

微信小程序教程之-小程序中使用echarts

微信小程序使用echarts教程平时经常在web系统中使用折线图、柱状图、仪表盘等等等图表展示数据，在浏览器页面中我们为了方便经常使用echarts，官网教程也写的很清楚。但是在微信小程序中我们同样有这种需求，那么如果直接用canvas，那么久太麻烦了，说不定一个折线图画一上午！，所有瞬间就会想到echarts等框架，但是echarts官网没有小程序版，不过！！！已经有人在github发布echa

虚幻的锈色·2018-12-20 17:01

微信小程序教程系列之设置标题栏和导航栏

微信小程序标题栏和导航栏的设置方法，具体内容如下设置标题栏标题栏window在app.json文件里面，通过window对象里面的属性进行设置示例：app.json：运行：设置导航栏导航栏TabBar如果我们的小程序是一个多tab应用（客户端窗口的底部或顶部有tab栏可以切换页面），那么我们可以通过tabBar配置项指定tab栏的表现，以及tab切换时显示的对应页面。欢迎加入全栈开发交流划水交流圈

880d91446f17·2018-11-30 15:25

清云小程序教程：微信小程序的技术架构特点

腾讯为微信小程序的工程项目开发了完整的编辑开发、运行调试、打包发布环境，形成了一个完整的IDE。有些朋友认为微信小程序就是H5，其实并不是这样。小程序借鉴了很多前端开发的技术理念，它用React实现了“视觉组件”，它用CMD的require作为面向对象的．JavaScript，用Vue实现了标签式逻辑与数据绑定。小程序用JavaSciipt语言、xML、CSS语言编写程序代码，写小程序代码几乎与’

清云小程序·2018-11-16 16:38

抖音上用记事本写“爱心”小程序教程

先上一波效果图：一颗旋转的小心心七夕的前一天晚上，当我满怀期待的把这颗“爱心”展示给我女朋友的时候，我以为她会very..very..happy但是..她和我说你给我颗大蒜干什么啊..Whyareyougivingmeagarlic..也就是那个时候，我突然觉得这真的像一颗大蒜哎好啦，不多说了。直接上源代码：Document@keyframesani{from{transform:rotateY(

明昊昊同学·2018-08-18 17:30

使用mpvue开发小程序教程（六）

在上一章节中，我们列举了在Vue中能用但在mpvue中不能用或需要特别注意的特性，在实际开发前了解一下还是很有必要的，可以避免浪费找错误的时间。如果你使用过原生的小程序框架，你一定经历过或思考过怎么解决以下的问题：怎么存放可全局访问的变量？页面跳转的时候，怎么传递参数到下一个页面比较好？页面返回上一页的时候，怎么传递当前页的数据到上一页？多个页面间需要同步数据，怎么做比较好？网上一搜，解决的方法通

一斤代码·2018-07-31 15:15

使用mpvue开发小程序教程（五）

在上一章节中，我们了解了组件的三个基本特性以及组件的基本使用方法。在实际的小程序开发中，我们应该以组件的思维去设计每个小程序的功能页面，对其进行合理的组件拆分，让每个部分都保持功能简洁、条理清楚、各司其职，这样会让代码变得更易理解和维护，间接的也提升了代码的健壮性，降低出现Bug的几率，即使出现Bug，也会更容易进行定位和调试。由于mpvue采用的是Vue框架的基础设施，所以大部分的功能都是和Vu

一斤代码·2018-07-30 19:10

使用mpvue开发小程序教程（四）

在上一章节中，我们将vue-cli命令行工具生成的代码骨架中的src目录清理了一遍，然后从头开始配置和编写了一个可以运行的小程序页面，算是正真走上了使用mpvue开发小程序的第一步。今天我们将进一步来了解和学习mpvue/Vue的其他重要功能。既然mpvue是基于Vue的，那么就没有理由不进一步学习一下Vue最核心的东西：组件。组件系统是Vue应用开发中最具价值的特性之一，在前文中其实我们就已经有

一斤代码·2018-07-26 18:31

使用mpvue开发小程序教程（三）

【注意事项】由于mpvue也在不断的开发演进，大家在不同时间段使用的时候，可能会遇到和文中的做法不一样的地方。请关注文章的评论区中大家的讨论，寻找解决方案，或者及时查阅官方文档，避免陷入版本更新的坑里哦。在上一篇文章中，我们熟悉了一下通过vue-cli生成的mpvue工程代码骨架的基本结构，大致了解了每一个部分的代码到底要放到何处。从本文起我们就开始涉及真正的编码部分，学习使用Vue的语法去编写小

一斤代码·2018-07-21 12:26

使用mpvue开发小程序教程（二）

在上一篇文章中，我们介绍了使用mpvue开发小程序所需要的一些开发环境的搭建，并创建了第一个mpvue小程序代码骨架并将其运行起来。在本文中，我们来研究熟悉一下mpvue项目的主要目录和文件结构。在VisualStudioCode里面打开项目文件夹，我们可以看到类似如下的文件结构：firstapp├──package.json├──project.config.json├──static├──sr

一斤代码·2018-07-18 18:01

使用mpvue开发小程序教程（一）

前段时间，美团开源了mpvue这个项目，使得我们又多了一种用来开发小程序的框架选项。由于mpvue框架是完全基于Vue框架的（重写了其runtime和compiler），因此在用法上面是高度和Vue一致的（某些功能由于受限于小程序环境本身的原因而不能使用），这给使用过Vue开发Web应用的前端开发者提供了极低的切换门槛来开发小程序。如果之前还未曾用过Vue这个框架的话，建议你可以快速浏览一下Vue

一斤代码·2018-07-17 13:58

快速开发一个自己的微信小程序教程

一．写在前面1.为什么要学小程序开发？对于前端开发而言，微信小程序因为其简单快速、开发成本低、用户流量巨大等特点，也就成了前端开发工程师必会的一个技能。2.开发准备：（1）有人开玩笑说，会vue小程序根本都不用学：微信小程序虽然是腾讯自己搞的，但是核心的思想跟vue等框架是一样一样的哦~（2）善于搜集精美的小组件：“我们不生产代码，我们只是代码的搬运工”，善于找到想要的组件并把他们巧妙优雅的组装成

蜘蛛游泳池·2018-07-15 16:07

微信小程序教程（搭建简单的小程序示例）

微信小程序是一个挺神奇的存在，它的出现使app不是那么的友好了，还要下载还要更新，但是小程序就不是了，就内嵌在微信里，随时用，不用下载（其实就相当于加载到本地，不过占用内存很小），微信服务器一更新就好了，这样多方便，小程序我刚开始接触还是蛮晕的，和正常的套路不太一样，不过它的js和vue,js太像了，不知道是谁模仿的谁，哈哈，下面开始记录，怎么一步步搭建自己的小程序吧。1.找官网api小程序的官网

小凤的知识课堂·2018-06-29 11:24

从零学习开发微信小程序教程

首先关于微信小程序是个什么玩意儿？还有小伙伴不知道的话，大家去微信公众平台，看看微信的官方解释，我就不再这里赘述了。如何安装微信web开发者工具安装这个工具其实就是跟安装.exe文件是一样的，直接点击下一步，直到finish（完成）。安装完成之后，开始这工具会提示你新建一个项目，并且输入一个微信小程序的appid。记住我建议大家用微信公众平台注册一个账号，并且选择微信小程序作为开发身份，因为里面只

Joychen404·2018-06-20 11:06

新手创建第一个微信小程序教程

在本地已有小程序开发环境的基础上，新手如何使用开发者工具、以及开发第一个微信小程序具体步骤和实施方法。本篇开发教程将详解新手入门时开发第一个微信小程序具体实施过程。在安装完“微信Web开发者工具”之后，通过开发者的微信扫码进入后，如图。点击“添加项目”，填入之前获得的AppID（无AppID可忽略），输入项目名称“HelloWXapplet”,选定本地文件夹作为项目目录。勾选“在当前目录中创建qu

Joychen404·2018-06-04 11:51

从零开发一个微信小程序教程

很多人了解bmob快速入门开发小程序，不懂的小伙伴可以看看“使用bmob后端云快速搭建小程序用户模块”这篇教程，并完成了简单的基本配置之后依然不知道如何下手去写自己的代码，其实，要想从零开发一个微信小程序，最好从实际项目开始动手，就算没有代码基础的小伙伴在开发过程中也能了解到小程序开发的技巧。下面为大家展示从零开始开发一个小程序步骤。下载和安装BmobSDK，先搭建好开发环境和服务器，为项目做准备

Joychen404·2018-06-01 10:53

微信小程序教程

微信小程序一.小程序环境http://www.php.cn/js/js-MINA.htmlhttps://developers.weixin.qq.com/miniprogram/dev/index.html?t=20184131.介绍微信小程序，简称小程序，缩写XCX，英文名MiniProgram,是一种不需要下载安装即可使用的应用，用户扫一扫即可打开应用开放申请的主体类型为企业，政府，媒体，其

周瑜大人·2018-05-31 15:17

mpVue高仿美团小程序教程

本章涉及知识点1、前言2、mpVue框架简介3、项目配置和结构4、主程序入口配置5、首页页面6、城市选择页面7、搜索页面8、订单列表页面9、我的页面10、商品详情页面11、评论列表页面12、提交订单页面13、订单详情页14、通用方法封装15、Vuex的设计16、后记一、前言继写完上一篇原生JS实现轻量Vue+指令解析+变异数组监听的代码和文章后，本来笔者已经写完了原生JS实现轻量React的代码，

PrivateEye_zzy·2018-05-24 10:25

小程序开发之wepy

title:小程序教程之wepy参考文档中文文档：https://tencent.github.io/wepy/document.html#/?

采香行处蹙连钱·2018-05-03 15:53

使用Vue开发微信小程序：mpvue框架

【最近更新】mpvue入门系列教程：如何在mpvue中正确的引用小程序的原生自定义组件使用mpvue开发小程序教程（六）使用mpvue开发小程序教程（五）使用mpvue开发小程序教程（四）使用mpvue

一斤代码·2018-03-09 19:31

别光顾着玩小游戏了！这个入口，能让你的小程序数据翻翻！

点击查看详情不过随后，在1月1日23：50左右，微信官方已经修复了这个漏洞，另外，还有知乎用户发表文章一篇名为《教你用Python来玩微信跳一跳》的“跳一跳”小程序教程，用电脑帮你玩微信跳一跳，全自动，

晓程序猿·2018-01-02 00:00

微信小程序教程 [第五篇]脚本语言（WXS）

这是微信小程序近期引入的一个概念，我们可以在开发者工具中直接以独立文件的形式建立它们。当然你也可以使用wxs标签直接在wxml文件中使用。两种访问均可以。使用场景：比如我们可以在视图里直接纳入简单的逻辑代码或是对page传递过来的变量进行处理（例如筛选和格式化等等），让你编码更简单。因此wxs有自己的变量和语法，接下来开始流水账。变量官方文档地址为https://mp.weixin.qq.com/

阿北·2017-10-31 00:00

微信有哪些好用的小程序？19款好用的微信小程序

今天的微信小程序教程中，小编就给大家整理了19款好用的微信小程序，那么，微信有哪些好用的小程序？一起来看看吧！

佚名·2017-10-19 16:31

史上最最最简单的小程序教程！

小程序也上线大半年了刚开始，所有人都像打了鸡血到后来的冷漠……不过，腾讯爸爸还是刁的近来动作频繁10篇文章里7篇都是小程序的能力升级！各种小程序的峰会、课程也层出不穷然鹅我TM却还是一点不会啊啊啊啊……不懂编程的痛直到我发现了一个免费工具！因为这个工具公司自发组织过「小程序速成班」成果是这样滴△上下拖动查看哦最重要的是：无需任何编程基础！无需任何编程基础！无需任何编程基础！快速制作专属小程序你也可

新媒体课堂·2017-08-22 00:00

小程序教程丨全宇宙最全最细的小程序操作手册——注册篇

最近小程序的新闻铺天盖地，大动作一个接一个，相信大家都已经蠢蠢欲动了。但是如何拥有一个自己的小程序呢？注册流程到底是怎么样的？我们给大家整理了一个详细的攻略，手把手教大家注册小程序。首先，我们将要注册小程序的商户们分成两类：1.已经拥有了认证过的企业公众号。2.还尚未注册过公众号。这两种类型的商户注册小程序的流程不一样，前者比较简单，因为资质可以复用，后者相对手续较多。我们分开来一一讲解。拥有认证

点点客·2017-08-11 10:20

微信小程序之微信登陆 —— 微信小程序教程系列（20）

简介：微信登陆，在新建一个微信小程序HelloWorld项目的时候，就可以看到项目中出现了我们的微信头像，其实这个HelloWorld项目，就有一个简化版的微信登陆。只不过是，还没有写入到咱们自家的后台中而已。新建一个HelloWorld项目，找到app.js文件打开，代码如下：app.js：App({onLaunch:function(){//调用API从本地缓存中获取数据varlogs=wx.

michael_ouyang·2017-05-23 02:10

微信小程序教程：文字跑马灯效果

当你的微信小程序内容中出现文字跑马灯效果，会不会觉得很拉风，接下来大家详细讲解下如何操作实现这效果。效果：wxml1显示完后再显示{{text}}2出现白边后即显示{{text}}{{text}}wxss.example{display:block;width:100%;height:100rpx;}.marquee_box{width:100%;position:relative;}.marqu

第九程序·2017-05-04 14:36

微信小程序教程系列之视图层的条件渲染（10）

本教程为大家分享了使用wx:if进行视图层的条件渲染，供大家参考，具体内容如下使用wx:if进行视图层的条件渲染示例：wxml：使用view按钮wxss：/**index.wxss**/.bg_black{height:200rpx;background:lightskyblue;}.bg_red{height:200rpx;background:lightpink;}js：//index.jsP

michael_ouyang·2017-04-19 11:43

微信小程序教程系列之设置标题栏和导航栏（7）

微信小程序标题栏和导航栏的设置方法，具体内容如下设置标题栏标题栏window在app.json文件里面，通过window对象里面的属性进行设置示例：app.json：运行：设置导航栏导航栏TabBar如果我们的小程序是一个多tab应用（客户端窗口的底部或顶部有tab栏可以切换页面），那么我们可以通过tabBar配置项指定tab栏的表现，以及tab切换时显示的对应页面。Tip：通过页面跳转（wx.n

michael_ouyang·2017-04-18 09:58

微信小程序实战之仿android fragment可滑动底部导航栏（4）

michael_ouyang·2017-04-18 09:39

微信小程序教程系列之新建页面（4）

例如在web的开发中，新建一个页面只需要新建一个html文件即可。但是到在微信小程序中，新建一个页面也不只是新建一个wxml文件，那么该如何做呢？下面我们一起来学习新建一个页面的步骤：1>必须要创建一个wxml文件和一个js文件，并且文件名要同名（例：test.wxml和test.js）。2>js文件内，需要写上注册页面的Page()函数！3>并且要到app.json文件中，注册新建页面的路径信息

michael_ouyang·2017-04-17 15:11

微信小程序教程系列之页面跳转和参数传递（6）

请到先阅读下面教程微信小程序的新建页面――微信小程序教程系列（4）index.wxml:在index.wxml新建一个button组件，并使用bindtap事件绑定一个函数index.js:在index.js

michael_ouyang·2017-04-17 15:50

微信小程序商城项目之淘宝分类入口（2）

如需学习页面跳转的同学，可以参考此文微信小程序的页面跳转和参数传递――微信小程序教程系列（6）页面分析：使用for循环遍历所有项，插入页面，页面中的项使用左浮动，并使用百分比布局，设置20%的宽度每一项

michael_ouyang·2017-04-17 14:53

微信小程序获取系统日期和时间 —— 微信小程序教程系列（17）

获取当前系统日期和时间在小程序中，新建项目时，就会有一个utils.js文件，就是获取日期和时间的，代码如下：utils.js：functionformatTime(date){varyear=date.getFullYear()varmonth=date.getMonth()+1varday=date.getDate()varhour=date.getHours()varminute=date.

michael_ouyang·2017-02-15 10:53

微信小程序的百度地图获取地理位置 —— 微信小程序教程系列（15）

由于小程序只提供了我们一个获取地理位置、速度的api，并没有获取的相关地位位置的信息等等，因此我们还需要借助一些第三方的api来实现下面，介绍使用百度地图的api来获取地位位置的信息。1>第一步：先到百度开放平台http://lbsyun.baidu.com申请akhttp://lbsyun.baidu.com/index.php?title=wxjsapi/guide/key申请到ak后，在我的

michael_ouyang·2017-02-14 13:34

微信小程序的网络请求 —— 微信小程序教程系列（14）

网络请求，基本上是必须的环节之一。小程序提供了wx.request(object)，与开发者的服务器实现数据交互的一个很重要的api。最简单的用法如下（以GET请求为例）[javascript]viewplaincopybindSearchChange:function(){wx.request({method:"GET",//注意请求方式必须要大写！！！url:'xxxxxxxxx',data:

michael_ouyang·2017-02-13 17:49

微信小程序之wxss —— 微信小程序教程系列（13）

WXSS（WeiXinStyleSheet）与CSS对应，用于描述页面的样式。特性内联样式：组件的style接收动态的样式，在运行时会进行解析，请尽量避免将静态的样式写进style中，以免影响渲染速度。选择器对于常用的选择器，目前支持的选择器有：注：绿色背景色行表示官方文档中没有说明，但经个人亲测后确定也支持的选择器。目前不支持的选择器有：注意：如之前提到，页面的顶层是节点，所以作用于整个页面的样

michael_ouyang·2017-02-13 16:42

微信小程序之wx:if视图层的条件渲染 —— 微信小程序教程系列（10）

使用wx:if进行视图层的条件渲染示例：wxml：使用view按钮wxss：/**index.wxss**/.bg_black{height:200rpx;background:lightskyblue;}.bg_red{height:200rpx;background:lightpink;}js：//index.jsPage({data:{boolean:false},EventHandle:f

michael_ouyang·2017-02-13 15:41

微信小程序标题栏和导航栏的设置 —— 微信小程序教程系列（7）

设置标题栏标题栏window在app.json文件里面，通过window对象里面的属性进行设置示例：app.json：运行：设置导航栏导航栏TabBar如果我们的小程序是一个多tab应用（客户端窗口的底部或顶部有tab栏可以切换页面），那么我们可以通过tabBar配置项指定tab栏的表现，以及tab切换时显示的对应页面。Tip：通过页面跳转（wx.navigateTo）或者页面重定向（wx.red

michael_ouyang·2017-02-13 10:16

微信小程序的页面跳转和参数传递 —— 微信小程序教程系列（6）

请到先阅读下面教程微信小程序的新建页面——微信小程序教程系列（4）index.wxml:在index.wxml新建一个button组件，并使用bindtap事件绑定一个函数index.js:在index.js

michael_ouyang·2017-02-09 13:33

微信小程序的如何使用全局属性 —— 微信小程序教程系列（5）

微信小程序提供了app.js文件，用于放置一些全局的函数和全局的属性。一般情况下，我都会把一些常用的函数和属性写在app.js文件内，这样不用在页面之间传值，或者不用重复加载。下面以全局属性为例新建一个helloworld项目在app.js页面中有一个globalData，这是一个全局对象。在里面添加一个属性info:"你好"那么要怎样才能获取到这些全局的属性使用呢？情况一：在非app.js文件的

michael_ouyang·2017-02-08 14:43

微信小程序如何新建页面 —— 微信小程序教程系列（4）

例如在web的开发中，新建一个页面只需要新建一个html文件即可。但是到在微信小程序中，新建一个页面也不只是新建一个wxml文件，那么该如何做呢？下面我们一起来学习新建一个页面的步骤：1>必须要创建一个wxml文件和一个js文件，并且文件名要同名（例：test.wxml和test.js）。2>js文件内，需要写上注册页面的Page()函数！3>并且要到app.json文件中，注册新建页面的路径信息

michael_ouyang·2017-02-08 10:05

微信小程序的动态修改视图层的数据 —— 微信小程序教程系列（3）

我们在正常的开发上，一般都比较少把视图层上面的数据写成固定形式的，很多都是通过动态获取数据时并更新页面上的数据显示出来下面让我们来一些学习，如何动态修改视图层的数据需求：创建一个按钮，点击这个按钮，改变视图层上面的数据示例：新建一个微信小程序的HelloWorld项目，找到index.wxml文件index.wxml:使用一个元素，使用bindtap事件作为点击事件index.js：在Page({

michael_ouyang·2017-02-08 09:12

微信小程序的生命周期实例演示 —— 微信小程序教程系列（2）

上篇教程微信小程序的文件结构——微信小程序教程系列（1）微信小程序的生命周期函数有2个一个是App的生命周期另一个是Page的生命周期App的生命周期示例：演示App的生命周期函数app.js：App(

michael_ouyang·2017-02-06 15:55

微信小程序的文件结构 —— 微信小程序教程系列（1）

文件结构示例目录：HelloWorld*******************************************************分割线********************************************************全局文件app.js文件这个是小程序的脚本代码文件，可以在这个文件上进行监听，并处理小程序的一些生命周期（比如一些全局变量）在这个ap

michael_ouyang·2017-02-05 22:21

微信小程序教程系列

michael_ouyang·2017-01-24 01:42

微信小程序教程（第八篇）

important;height:auto;margin:0auto;}微信小程序教程（第八篇）2017-01-16Mr.Wu宏记宏记宏记微信号hongji8410功能介绍分享互联网信息js页面获取wxml

插班实习山大王·2017-01-16 15:31

小程序教程-1

http://pan.baidu.com/s/1qYk0Ubq密码：078s视频教程链接：http://pan.baidu.com/s/1pLS2q63密码：ehp9Demo代码链接：http://pan.baidu.com/s/1pLHDaNT密码：0xjx基础课程链接：http://pan.baidu.com/s/1slwAnpz密码：3z3r官方工具包链接：http://pan.baidu.

sponing·2017-01-13 11:19

微信小程序教程入门篇（4）：高仿一个漂亮的手机界面-极其详细-partB

下面是这三篇文章：《微信小程序教程入门篇（1）：10分钟从0开始写一个helloworld，极

安肖雄·2017-01-09 00:07

【微信小程序教程】——input正则表达式验证的使用

1、效果展示2、关键代码index.wxml文件输入结果：{{result}}index.js文件//判断用户输入的是否为小写字母varregLowerCase=newRegExp('[a-z]','g');//判断用户输入的是否为大写字母varregCapitalLetter=newRegExp('[A-Z]','g');//判断用户输入的是否为数字varregNum=newRegExp('[0

FutrueJet·2016-11-17 10:31

微信小程序教程之本地图片上传(leancloud)实例详解

微信小程序leancloud――本地图片上传由于本站最近学习微信小程序的知识，这里记录下微信小程序实现本地上传的功能实现方法，以下是网上找的资料，大家看下。将本地图片上传至leancloud后台.获取本地图片或者拍照,我在上一篇博文中写过.这里就不说了.我的博客直接上代码:1.index.js//index.js//获取应用实例varapp=getApp()constAV=require('../

dzp_coder·2016-11-16 10:46

推荐频道

小程序教程