其他微信小程序的学习笔记

自己的微信小程序学习笔记【1】——小程序开发工具的使用及项目文件说明
自己的微信小程序学习笔记【2】——从零开始新建项目


文章目录

  • 其他微信小程序的学习笔记
  • 前言
  • 一、Lin-UI组件库
    • 1.使用组件库的前提
    • 2.Lin-Ui的安装方式
  • 二、Lin-Ui组件的使用

前言

微信小程序所提供的组件的样式一般无法达到我们的设计效果,这时候,外部组件库就可以提供非常美观的组件。作为学习笔记,本文使用的是Lin-UI组件库,有必要给大家提供一下连接:

  • Lin-UI 官网:https://doc.mini.talelin.com
  • github 仓库地址:https://github.com/TaleLin

一、Lin-UI组件库

Lin UI 是基于 微信小程序原生语法 实现的组件库。遵循简洁,易用的设计规范。

1.使用组件库的前提

  • Lin-UI组件库需要提前安装Node-js
  • 确保npm可以使用。

确认是否已经安装好Node-js。可以在终端中输入命令:

node -v
npm -v

安装成功的话,这两个指令是会输出相应的版本号

2.Lin-Ui的安装方式

首先使用在微信小程序开发工具里打开终端:

一步步使用以下指n令:

npm init 指令可以直接点击回车

npm init
npm i lin-ui@0.8.7

完成之后,会在项目的根目录下生成package.json文件和node_modules文件夹,这时候需要构建npm:

二、Lin-Ui组件的使用

Lin-Ui组件也属于自定义组件,所以需要在页面配置例如welcome.json中配置这个组件的名字及路径:

{"usingComponents": {"l-avatar":"/miniprogram_npm/lin-ui/avatar/index"}
}

其中:

  • “l-avatar”: 自定义组件的名字,可以自行定义
  • “/miniprogram_npm/lin-ui/avatar/index”:对应其组件的路径,这个是头像组件

配置完成之后,就可以在.wxml中使用该组件名称的组件了。

open-data 获取头像的组件目前已经被微信收回了,不能使用这个接口来获取微信用户头像及昵称了。具体请看Lin-Ui的官网

自己的微信小程序学习笔记【3】——第三方UI库Lin-Ui的加载及使用相关推荐

  1. 小程序 pagescrollto_微信小程序学习笔记(三)-- 首页及详情页开发

    一.常用组件 在上一个章节中讲解了封装请求数据的模块,在此处请求轮播图的数据 1.首页轮播图数据的请求以及渲染 1.1 轮播图数据的请求 pages/home/home.js import 2 使用组 ...

  2. 微信小程序学习笔记(1)

    微信小程序学习笔记 1.小程序代码结构 2.逻辑层和视图层 3. 小程序的宿主环境(通信模型.运行机制.组件.API) 4. 数据绑定和事件绑定 1.小程序代码结构 当开发者新建一个工程时,项目文件包 ...

  3. 微信小程序学习笔记一 + 小程序介绍 前置知识

    微信小程序学习笔记一 1. 什么是小程序? 2017年度百度百科十大热词之一 微信小程序, 简称小程序, 英文名 Mini Program, 是一种不需要下载安装即可使用的应用 ( 张小龙对其的定义是 ...

  4. 微信小程序学习笔记(一)

    干货来袭 基础前言   微信⼩程序,简称⼩程序,英⽂名 Mini Program ,是⼀种不需要下载安装即可使⽤的应⽤,它实现 了应⽤"触⼿可及"的梦想,⽤⼾扫⼀扫或搜⼀下即可打开 ...

  5. 微信小程序学习笔记(七)----简单文章推荐列表和分类图标的实现

    想要实现一个顶部是几篇纯文字的推荐文章,推荐文章下面是四个分类图标,具体实现出来是这个样子的,比较简单: 首先先来找一下素材,这几个图标是我在阿里巴巴图标库下载的,这里是下载地址: http://ww ...

  6. 微信小程序学习笔记(一)入门

    思维导图 文章目录 1. 微信小程序简介 1.1 小程序与普通网页开发的区别 2. 小程序初体验 2.1 注册小程序开发帐号 2.2 开发者工具 2.2.1 了解微信开发者工具 2.2.2 下载开发者 ...

  7. 微信小程序-学习笔记6-组件

    基础内容组件:icon.text.progress <view class="container"><progress percent="20" ...

  8. 微信小程序学习笔记02:微信小程序注册

    文章目录 零.学习目标 一.小程序注册方法 1.注册 2.登录 二.小程序开发工具 1.下载开发工具 2.安装开发工具 3.启动开发工具 三.创建第一个小程序 1.启动开发者工具 2.新建项目 3.模 ...

  9. 微信小程序学习笔记01:微信小程序概述

    文章目录 零.学习目标 一.小程序的历史 二.如何访问小程序 1.线下扫码 2.微信搜索 3.公众号关联 4.好友推荐 5.历史记录 6.桌面访问 7.附近的小程序 三.小程序与HTML5和APP比较 ...

最新文章

  1. 两个多选框(select)之间值的左右上下移动
  2. 《算法竞赛进阶指南》打卡-基本算法-AcWing 96. 奇怪的汉诺塔:递推
  3. [android网络有效性检测] NetworkMonitor代码造成内存泄漏
  4. 大数据与web开发整合的最佳实践-思考
  5. Mysql 重做日志及与二进制日志的区别
  6. mysql设置查询结果最大值_查找MySQL查询结果字段的最大值
  7. spark笔记之Scala中的协变、逆变、非变
  8. php 查询条件 session,PHP获取不到SESSION信息之一般情况解决方案
  9. 2021年山东大学考研数字电路906真题
  10. 通达OA2013完美平台补丁以及手机短信服务配置
  11. c语言long可以存几位数,long long 可以支持多少位的数?
  12. 2017腾讯校招面试回忆 成功拿到offer
  13. 【毕业设计】总结、展望及参考文献
  14. 12_传智播客iOS视频教程_注释和函数的定义和调用
  15. 数据中台02:数据中台架构
  16. 高德定位SDK踩坑-高精度模式下获取不到GPS定位(无网络环境)
  17. C语言遍历文件目录:readdir,opendir
  18. java stream order by_Java Stream 使用详解
  19. 微信小程序商城 (后台JAVA)
  20. 奇数点偶数点fft的matlab,电子科大 数字信号处理实验2_FFT的实现

热门文章

  1. IBM 区块链试点寻求解决快递的最后一英里
  2. 梧桐叶下的阳光是我们的青春
  3. 最新版本微信中的QQ音乐会员免费领取
  4. pandapower最优潮流
  5. 畅想未来计算机英语作文带翻译,my future life 英语作文带翻译
  6. 渣本双非进大厂,3轮技术面+1轮HR面,拿下字百万年薪offer
  7. 分苹果 A,B两个人把苹果分为两堆,A希望按照它的计算规则等分苹果,他的计算规则是按照二进制加法计算,并且不计算走位,12+5=9(1100+0101=9)
  8. 苹果cms如何修改默认首页
  9. Kali Linux换更新源及更新软件和系统教程
  10. Java技术知识点总结