请选择 进入手机版 | 继续访问电脑版
查看: 2636|回复: 20

[其他] 【小程序新手笔记分享】小程序开发记录贴

[复制链接]
发表于 2019-12-10 19:11:31 | 显示全部楼层 |阅读模式
打个卡,正在学习当中
 楼主| 发表于 2019-12-17 09:15:39 | 显示全部楼层
每个小程序都有唯一的子域名;
URL 中 path 和 query 部分和小程序页面中的 path 和 query 一致。比如:上例对应的小程序页面在百度App中的打开路径即为 /pages/detail/index?id=1;
如URL为指定 path 和 query,默认跳转首页。

点评

  发表于 2021-1-11 10:09
回复 支持 反对

使用道具 举报

 楼主| 发表于 2019-12-17 09:17:14 | 显示全部楼层
小程序的路径注意设置全局,小程序的任何一个页面都可能被作为入口访问,比如搜索结果页可能会分发二级页面,用户也可能通过收藏、分享等操作直接访问二级页面,等。因此应该保证任何页面都可以不依赖之前的页面数据,独立被访问。

点评

  发表于 2021-1-11 10:09
回复 支持 反对

使用道具 举报

 楼主| 发表于 2019-12-17 09:18:09 | 显示全部楼层
如何判断 H5 页面是否在小程序 web-view 打开?
H5 运行时,通过 window.navigator.userAgent 获取浏览器 userAgent。当 userAgent 字符串中包含小程序标识:‘swan/’时,则说明当前环境为小程序 web-view。

点评

  发表于 2021-1-11 10:10
回复 支持 反对

使用道具 举报

 楼主| 发表于 2019-12-17 09:19:50 | 显示全部楼层
在web-view中使用拨打电话的功能
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>call phone</title>
        <script  src="BAIDU提交url"></script>
    </head>
    <body>
        <button onclick="callMobile()">clickMe</button>
    </body>
    <script type="text/javascript">
        function callMobile() {
            swan.makePhoneCall({
                phoneNumber: '10086'
            });
        }
    </script>
</html>

点评

  发表于 2021-1-11 10:10
回复 支持 反对

使用道具 举报

 楼主| 发表于 2019-12-17 09:21:59 | 显示全部楼层
这部分是每个智能小程序页面的展现模板,类似于 Web 开发中的 HTML,SWAN 模板中使用的标签均为 SWAN 组件规定的标签。
<view s-for="item in items" class="single-item" bind:tap="oneItemClick" bind:touchstart="oneItemTouchStart" bind:touchmove="oneItemTouchmove" bind:touchcancel="oneItemTouchcancel" bind:touchend="oneItemTouchEnd">
    <image src="{{item.imgsrc}}" class="single-img"></image>
    <view class="single-text-area">
        <text class="single-title">
            {{item.title}}
        </text>
        <view s-if="{{item.tags}}" class="tag-area">
            <text s-for="tag in item.tags" class="{{tag.className}}">
                {{tag.content}}
            </text>
        </view>
    </view>
</view>
<view class="view-more" bind:tap="loadMore">
    <text>点击加载更多</text>
</view>

点评

  发表于 2021-1-11 10:10
回复 支持 反对

使用道具 举报

 楼主| 发表于 2019-12-17 09:23:44 | 显示全部楼层
getCurrentPages() 函数用于获取当前页面栈的实例,以数组形式按栈的顺序给出,第一个元素为首页,最后一个元素为当前页面。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2019-12-19 09:14:28 | 显示全部楼层
navigateTo, redirectTo 只能打开非 tabBar 页面。
switchTab 只能打开 tabBar 页面。
reLaunch 可以打开任意页面。
页面底部的 tabBar 由页面决定,即只要是定义为 tabBar 的页面,底部都有 tabBar。
调用页面路由带的参数可以在目标页面的 onLoad 中获取。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2019-12-19 09:15:25 | 显示全部楼层
智能小程序框架,会将同页面的 .swan 文件与 .js 中定义的 Page 对象中的 data,进行组合渲染。
回复 支持 反对

使用道具 举报

 楼主| 发表于 2019-12-19 09:41:51 | 显示全部楼层
App函数必须在 app.js 中被调用一次。该函数在整个小程序中不能被调用多次,否则会出现无法预期的后果。
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

手机版|Archiver|Baidu Inc.

GMT+8, 2021-3-7 23:59 , Processed in 0.257882 second(s), 16 queries .

Powered by Discuz! X3.2

© 2001-2011 Comsenz Inc.

返回顶部