
小程序
小程序开发
soosgo
这个作者很懒,什么都没留下…
展开
-
微信小程序-图片预览图
有时候图片列表图片过小看不清图片内容,这时我们一般就希望点击图片可以放大显示进行预览,那么,接下来我们就调用微信原生API的的浏览图片程序进行对图片预览的实现。原创 2023-04-18 11:10:31 · 2223 阅读 · 0 评论 -
小程序之自定义组件及其使用
在开发程序的过程当中,很多时候我们会遇到这样的问题,就是相似样式的模块重复多次的出现,那么对于这种情况有没有简单的方法可以统一管理呢?是有的!在我们小程序当中,除了前面讲到的模板可以使样式类似的内容统一管理,我们也可以通过自定义组件来定义重复出现的模块。下面我们以星级评定为例来讲解一下自定义组件的使用:首先我们需要在项目中新建一个文件夹如:components 用于存放所有的自定义组件;第二步:新建一个stars的星级评定文件夹,存放我们要写的内容;第三步:选中stars文件夹,..原创 2021-01-20 17:44:21 · 251 阅读 · 0 评论 -
小程序发送HTTP请求
网络请求API小程序中的数据,并不是写死的。而是从服务器动态加载的。这时候就需要借助网络请求的 api 来实现。 api 全称 application programming interface ,是小程序提供给开发者的接口。 api 的调用都是在 js 文件中完成的。网络请求的 api 相关的介绍请参考:https://developers.weixin.qq.com/miniprogram/dev/api/wx.request.html。聚合数据网址:https://www.juhe.cn/s原创 2021-01-20 11:28:54 · 1905 阅读 · 0 评论 -
小程序之scroll-view组件
scroll-view 可滚动视图区域。有时候我们的一些视图在手机指定的宽度和高度不够存放,那么可以放在 scroll-view 中,以滚动的形式显示被隐藏的内容。滚动视图分为横向滚动和纵向滚动两种方式,下面我们对视图的滚动进行一一说明。横向滚动设置横向滚动(必须满足以下三点):1.给scroll-view添加scroll-x="{{true}}"属性(设置为允许横向滚动)2.给scroll-view添加white-space:nowrap;属性(设置为不换行)3.给scroll-v原创 2021-01-20 10:40:29 · 18761 阅读 · 0 评论 -
小程序之页面间传值
页面间传值是我们开发程序时常见,那么小程序是怎样实现页面间传值呢?我们就过下面的例子来实现小程序的页面间传值:大致功能如下,第一个页面微博列表页list.wxml,点击列表页面的按钮跳转至微博编辑页面aweibo.wxml,在编辑页面点击提交按钮返回上一个页面并且将编辑的内容显示在列表页面。微博列表页面代码如下:<!--pages/weibo/list/list.wxml--><view>这是第一条微博</view><view wx:for原创 2021-01-19 10:29:48 · 210 阅读 · 0 评论 -
小程序之include引用
在我们开发程序的时候,一般有很多相似的内容重复出现,那么对于这些内容除了使用模板我们也可以使用另外的一个功能模块---引用。include可以将目标文件除了<template/><wxs/>外的整个代码引入,相当于是拷贝到include位置,如:<!-- index.wxml --><include src="header.wxml"/><view> body </view><include src="...原创 2021-01-13 10:53:01 · 1443 阅读 · 0 评论 -
小程序之模板
模板WXML提供模板(template),可以在模板中定义代码片段,然后在不同的地方调用。定义模板使用 name 属性,作为模板的名字。然后在<template/>内定义代码片段,如:<!-- 定义模板 --><template name="message"> <view class="message-group"> <text class="content">{{content}}</text>原创 2021-01-13 10:28:08 · 230 阅读 · 0 评论 -
小程序之audio音频组件
audio音频组件相关属性:属性 类型 默认值 必填 说明 最低版本 id string 否 audio 组件的唯一标识符 1.0.0 src string 否 要播放音频的资源地址 1.0.0 loop boolean false 否 是否循环播放 1.0.0 controls boolean false 否 是否显示默认控件 1..原创 2021-01-07 16:50:46 · 1149 阅读 · 0 评论 -
小程序之swiper滑块视图容器
滑块视图容器。其中只可放置swiper-item组件,否则会导致未定义的行为。可使用swiper制作轮播图效果,swiper组件相关参数如下:属性 类型 默认值 必填 说明 最低版本 indicator-dots boolean false 否 是否显示面板指示点 1.0.0 indicator-color color rgba(0, 0, 0, .3) 否 指示点颜色 1.1.0 indicato原创 2021-01-07 16:34:28 · 421 阅读 · 0 评论 -
小程序之消息提示框与模态框
提示框:wx.showToast(OBJECT)显示消息提示框OBJECT参数说明:示例代码:wx.showToast({ title: '成功', icon: 'success', duration: 2000})wx.hideToast()隐藏消息提示框wx.showToast({ title: '加载中', icon: 'loading', duration: 10000}) setTimeout(function(){ wx.hideToas原创 2021-01-07 12:00:44 · 409 阅读 · 0 评论 -
小程序页面编辑
页面编辑可直接在.wxml文件中进行编辑即可,但是编辑的时候需要注意,对应的.js文件必须先“获取应用实例”,初始化页面设置,在wxml中编辑的内容才能在页面中显示。获取应用实例如下://获取应用实例var app=getApp();//初始化页面Page({ data:{ }});...原创 2021-01-06 16:01:23 · 289 阅读 · 0 评论 -
小程序中常用的组件
viewblocktext原创 2021-01-06 16:01:14 · 305 阅读 · 0 评论 -
创建APP导航栏
给小程序添加导航栏在app.json文件夹中的大括号里,敲“tab”会提示,敲回车会自动载入tabBar相关参数,结果如下注意app.json中不能添加注释"tabBar": { "list": [{ "pagePath": "pagePath", "text": "text", "iconPath": "iconPath", "selectedIconPath": "selectedIconPath" }]}tabBar导航"list": [原创 2021-01-05 09:34:56 · 276 阅读 · 0 评论 -
小程序快捷键
Shift + Delete 删除整行 Shift+Alt+Up,Shift+Alt+Down:向上向下复制一行Shift+Alt+F:代码格式化Alt+Up,Alt+Down:上下移动一行Ctrl+S:保存文件Ctrl+[, Ctrl+]:代码行缩进Ctrl+Shift+[, Ctrl+Shift+]:折叠打开代码块Ctrl+C Ctrl+V:复制粘贴,如果没有选中任何文字则复制粘贴一行Ctrl+Shift+Enter:在当前行上方插入一行Ctrl+F 搜索...原创 2021-01-04 17:22:06 · 423 阅读 · 0 评论 -
数据绑定与列表渲染
数据绑定WXML 中的动态数据均来自对应 Page 的 data。简单绑定数据绑定使用 Mustache 语法(双大括号)将变量包起来,可以作用于:内容<view> {{ message }} </view>Page({ data: { message: 'Hello World!' }})控制属性(需要在双引号之内)<view wx:if="{{condition}}">condition控制内容部分</v原创 2021-01-04 17:13:22 · 242 阅读 · 0 评论 -
微信小程序初始代码分析
新创建一个小程序一般程序目录如下:其中最关键也是必不可少的,是app.js、app.json、app.wxss这三个文件。其中.js后缀的是脚本文件,.json后缀的是配置文件,.wxss后缀的是样式表文件(与CSS类似)。pages文件夹里包含了有关的页面文件夹,需要注意的是文件夹的名字必须和文件的名字一样。每个页面文件夹里面一般包含如下四种文件:.json 后缀的 JSON 配置文件 (可以没有).wxml 后缀的 WXML 模板文件(必须包含).wxss 后缀的 WXSS 样式文件原创 2020-12-16 11:04:33 · 757 阅读 · 0 评论