【微信小程序】快速入门学习笔记

发布于:2023-01-09 ⋅ 阅读:(442) ⋅ 点赞:(0)

简介

用完即走,门槛低,流量大。
简介
占领
在这里插入图片描述
主要开发语言javascript
在这里插入图片描述

API

(Application Programming Interface,应用程序编程接口)是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,或理解内部工作机制的细节。

首先 购买

确定ui 借助colorUI
在这里插入图片描述

开发文档

在这里插入图片描述

目录结构

在这里插入图片描述

小程序目录各部分解析在这里插入图片描述

utils公共的js
在这里插入图片描述
js负责逻辑层 交互
json负责配置 标题名
wxss=css样式文件 改个宽高啊
wxml=html框架的设计
page保存页面

app。负责全局
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

入门day1

view创建标签
css : 。box。。。

第一次学api

hovor组件
hovorbox点击事件
hovor-class=“”

不加{{}}会当成string传进去,加{{}}的话就是布尔类型
hover-stop-propagation=“{{true}}”>1111

复习对应html

div块标签
span行标签
加粗。。。

.out view{color: blue; display: inline;}这是把两行变一行

法2:直接用text标签来把两个元素拼接
注意:文字是否可选 只能用 此实现哦

asfjlkjafkljfal 文字可选与否

加连续空格

asfjl kjafkljfal

解析html5代码

失物  < 招领
第一个是空格 第二个左尖角

Bug & Tip
tip: decode可以解析的有 &nbsp; &lt; &gt; &amp; &apos; &ensp; &emsp;
tip: 各个操作系统的空格标准并不一致。
tip:text 组件内只支持 text 嵌套。
tip: 除了文本节点以外的其他节点都无法长按选中。

多天后继续 3.9

image 对标签 对应 --------img
在这里插入图片描述

实际未来一定是用网络中 因为大小限制

不然就用 图片在线压缩工具 网页

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

这个链接可以访问外网 但是对比url却不可以。怕被给别人做嫁衣!

法2 绝对路径

单个标签可以不过要加斜杠在这里插入图片描述

.img1{width: 100px; height: 200px;}

在这里插入图片描述
mode=“”
在这里插入图片描述
widthFix 缩放模式,宽度不变,高度自动变化,保持原图宽高比不变

在这里插入图片描述
常用缩放模式

发送给朋友

在这里插入图片描述

超链接navigator

navigator= a标签

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
tiaozhuandao log 重定向

牛逼

还有tabBar状态
在这里插入图片描述
可以携带参数 ?id=123

视图容器 左右滑动的菜单 scrow-view

在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
这样的 效果

还有滑动效果
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

神仙轮播 更简单比起上面

在这里插入图片描述


网站公告

今日签到

点亮在社区的每一天
去签到