# MiniLearnShopping

**Repository Path**: javakam/MiniLearnShopping

## Basic Information

- **Project Name**: MiniLearnShopping
- **Description**: 小程序学习项目.......
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2023-04-24
- **Last Updated**: 2023-04-27

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

### 小程序商城 Demo

https://developers.weixin.qq.com/community/develop/doc/0004466081c3c034c80ec59745bc00

#### 框架

tdesign

https://tdesign.tencent.com/miniprogram/overview

https://github.com/Tencent/tdesign-miniprogram

weui

https://wechat-miniprogram.github.io/weui/docs/

https://github.com/wechat-miniprogram/weui-miniprogram/

https://developers.weixin.qq.com/miniprogram/dev/platform-capabilities/extended/component-plus/sticky.html

vant-weapp

https://github.com/youzan/vant-weapp

https://youzan.github.io/vant-weapp/#/quickstart

##### 安装`weui`的`mp-sticky`

1. 项目目录中打开 powershell , 执行`npm init`初始化, 会创建`package.json`文件;
2. 执行`npm install @miniprogram-component-plus/sticky`, 会创建`node_modules`文件夹;
3. 执行"工具->构建 npm"创建`miniprogram_npm`文件夹
4. `usingComponents`中引入 "mp-sticky": "@miniprogram-component-plus/sticky"

#### json-server

https://github.com/typicode/json-server

1. 先安装`nodejs`环境: https://nodejs.org/en/download/
2. 下载`json-server`: `npm install -g json-server`, 通过`json-server -v`验证
3. 创建`data.json`文件, 本机地址 C:\fastwork\Project\WeiXinJsonServer
4. 开启`json-server`: `json-server --watch data.json --port 5001`, 端口号可以不加默认为 3000

#### 底部导航图标

https://www.iconfont.cn/collections/detail?spm=a313x.7781069.1998910419.d9df05512&cid=33205

https://www.iconfont.cn/collections/detail?spm=a313x.7781069.1998910419.d9df05512&cid=1620

#### vtabs

https://developers.weixin.qq.com/miniprogram/dev/platform-capabilities/extended/component-plus/vtabs.html

#### web-view/video

<!--
  业务域名配置
  https://developers.weixin.qq.com/community/develop/doc/000ec6fb31c528a45fca360a85b800?_at=1636966764580
 -->

<web-view src="http://m.zqrb.cn/"></web-view>

<!-- <video style="height:240px;width:320px;" src="http://wxsnsdy.tc.qq.com/105/20210/snsdyvideodownload?filekey=30280201010421301f0201690402534804102ca905ce620b1241b726bc41dcff44e00204012882540400&bizid=1023&hy=SH&fileparam=302c020101042530230204136ffd93020457e3c4ff02024ef202031e8d7f02030f42400204045a320a0201000400"></video> -->

### 小程序数组操作

https://blog.csdn.net/natalie86/article/details/44236763

书栈网
https://www.baidu.com/link?url=IZ8PkoAVVFpAPVnOgUn1DTtmY_WFYy522FtY_4Bn40Dxvdce4c7Ie7affn0NXUjhEKjcL9NVAODno5nNOQfAI_jaypouPHsyhBDGCit-wa3&wd=&eqid=b77ae9c000002f97000000066195c259

1. 数组后面增加元素, this.data.goods.plus(...)
2. 数组前面增加元素, newGood.concat(this.data.goods)
3. 数组删除指定位置元素, this.data.goods.splice(index,1) 或者 this.data.goods.filter((item) => item.id != id)
4. 数组清空, this.data.goods:{} , this.setData({this.data.goods})
5. 数组常用操作 map , filter , every(全部符合返回 true,有一个不符合条件则为 false) ...

json-server --watch data.json --port 5001