第一章:小程序初级入门教程

小试牛刀【含视频】

视频地址:https://v.qq.com/x/page/i0554akzobq.html

这一章节中,我们尝试着写一个最简单的例子,包含 2 个静态页面,并增加菜单导航功能。小体验一把。

Step 1. 清理结构

清理后如下结构,只保留了两个 必备 文件,同时做如下修改:

├── app.js
├── app.json
//app.js
App({
onLaunch: function () { }
})
{
"pages":[
],
"window":{
"navigationBarBackgroundColor": "#09ba07",
"navigationBarTextStyle": "#fff",
"navigationBarTitleText": "牛刀小试",
"backgroundColor": "#fbf9fe",
"backgroundTextStyle": "light"
}
}

修改后,看下控制台有报错信息,因为我们把页面全都干掉了。

从报错信息来看,很明显,小程序默认会从 pages 字段中读取第一个地址,作为首页加载 -- 知识点

Step 2. 增加 flex 页面

ok,现在开始添加我们的第一个页面,给它起个名字叫 flex 吧,防止大家 误以为名字叫 index 的才是默认打开的页面

微信小程序基于最新版1.0开发者工具分享-小试牛刀(视频)+发布流程的更多相关文章

  1. iKcamp出品|微信小程序|工具安装+目录说明|基于最新版1.0开发者工具初中级教程分享

    iKcamp官网:http://www.ikcamp.com 访问官网更快阅读全部免费分享课程:<iKcamp出品|全网最新|微信小程序|基于最新版1.0开发者工具之初中级培训教程分享>. ...

  2. 微信小程序教学第二章:小程序中级实战教程之预备篇 - 项目结构设计 |基于最新版1.0开发者工具

    iKcamp官网:http://www.ikcamp.com 访问官网更快阅读全部免费分享课程:<iKcamp出品|全网最新|微信小程序|基于最新版1.0开发者工具之初中级培训教程分享>. ...

  3. iKcamp出品|全网最新|微信小程序|基于最新版1.0开发者工具之初中级培训教程分享

  4. 微信小程序-基于canvas画画涂鸦

    代码地址如下:http://www.demodashi.com/demo/14461.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...

  5. 微信小程序基于swiper组件的tab切换

    代码地址如下:http://www.demodashi.com/demo/14010.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...

  6. 微信小程序基于scroll-view实现锚点定位

    代码地址如下:http://www.demodashi.com/demo/14009.html 一.前期准备工作 软件环境:微信开发者工具 官方下载地址:https://mp.weixin.qq.co ...

  7. 微信小程序-基于高德地图API实现天气组件(动态效果)

    微信小程序-基于高德地图API实现天气组件(动态效果) ​ 在社区翻腾了许久,没有找到合适的天气插件.迫不得已,只好借鉴互联网上的web项目,手动迁移到小程序中使用.现在分享到互联网社区中,帮助后续有 ...

  8. 微信小程序 -- 基于 movable-view 实现拖拽排序

    微信小程序 -- 基于 movable-view 实现拖拽排序 项目基于colorui样式组件 ColorUI组件库 (color-ui.com) 1.实现效果 2. 设计思路 movable-vie ...

  9. 微信小程序云开发-从0打造云音乐全栈小程序

    第1章 首门小程序“云开发”课程,你值得学习本章主要介绍什么是小程序云开发以及学习云开发的重要性,并介绍项目的整体架构,真机演示项目功能,详细介绍整体课程安排.课程适用人群以及需要掌握的前置知识.通过 ...

随机推荐

  1. 编程语言 : Java的动态Web解决方案泛谈

    文章概述 最近发现很久前一股脑地学习框架,发觉越发迷糊.知道了框架只是暂时的,重点是基础的技术.该文大篇幅回顾Servlet技术栈和简要的MVC框架. 至于为什么学J2EE,额,大家都用框架,可框架也 ...

  2. shell的EOF用法

    将命令输出的结果给一个循环处理,常用的方式如下: [root@etch171 guosong]# ls |while read line;do echo $line;done processlist ...

  3. 【机器学习】人工神经网络ANN

    神经网络是从生物领域自然的鬼斧神工中学习智慧的一种应用.人工神经网络(ANN)的发展经历的了几次高潮低谷,如今,随着数据爆发.硬件计算能力暴增.深度学习算法的优化,我们迎来了又一次的ANN雄起时代,以 ...

  4. 网页如何展示PPT文档

    最近再做一个新项目,其中有一个难点,就是如何在网页上展示PPT,我网上找到了几种方法,但是真正符合我目前这个项目的就只有这一种方法了,       使用PowerPoint to Flash将ppt文 ...

  5. YII 多表联查 纵表

    A id 与B a.id B id 与C b.id C id 与D c.id 查A读D数据 应用场景: order表 ordergoods表 goods表 merchant加盟商 order 与ord ...

  6. setTimeout和setInterval的使用

    引自(http://www.cnblogs.com/qiantuwuliang/archive/2009/06/20/1507304.html) 这两个方法都可以用来实现在一个固定时间段之后去执行Ja ...

  7. canvas 粒子效果

    var canvas = document.createElement('canvas'); var cxt = canvas.getContext('2d'); var W = canvas.wid ...

  8. jquery总结(来自于一个讲师的总结)

    选择器 基本选择器:id class 标签 eq()查找具体的列表中的元素:$('ul li:eq(n)').eq(n) 层 :div p,div>p 查找:find 选中元素中再查找子元素,p ...

  9. springboot + redis缓存使用

    [参照资料] 1.spring boot 官网文档 2.https://www.cnblogs.com/gdpuzxs/p/7222309.html [项目结构] [pom.xml配置] <?x ...

  10. Flex布局学习笔记

    任何元素都可以使用Flex布局,包括行内元素 display: flex; display: inline-flex使用Flex布局之后,子元素的float, clear, vertical-alig ...