2021-11-17 小程序-笔记

网址参考:https://youzan.github.io/vant-weapp/#/quickstart


Field 输入框

介绍

用户可以在文本框内输入或编辑文字。

步骤

1.新建一个终端,初始化一个包的描述文件,npm init 

2.安装一个第三方的包,通过 npm 安装,在终端输入:npm i @vant/weapp -S --production 

安装完成之后会出现一个 node_modules 文件夹

3.点击菜单栏 工具-构建 npm


构建完成,点击确定


创建项目:

 1.项目目录

pages目录:用于存放所有的页面。

utils目录:用于存放工具类文件。

app.js:是入口文件,程序在运行时,首先要执行该文件。

app.json:是全局配置文件,用于配置小程序的信息(它里面配置的是全局信息)。

app.wxss:是全局样式文件。全局样式文件里面定义的选择器,在所有的页面中生效。

project.config.json:是项目配置文件。

sitemap.json:是SEO配置文件,方便用户搜索到该小程序。

2.app.json

(1)pages配置项

pages里面注册的是视图。用于指定小程序由哪些页面组成,每一项都对应一个页面的路径(含文件名)信息。

 

(2)window配置项

window 是全局窗口配置。

backgroundTextStyle 设置文本样式(下拉loading的样式),仅支持 dark / light。

navigationBarBackgroundColor 设置导航栏背景。

navigationBarTitleText 设置导航栏文本。

navigationBarTextStyle 设置导航栏标题颜色,仅支持 black / white。

代码:

 "window":{

    "backgroundTextStyle":"light",

    "navigationBarBackgroundColor": "#369",

    "navigationBarTitleText": "KW43-APP",

    "navigationBarTextStyle":"white"

  }


Button 按钮

介绍:

按钮用于触发一个操作,如提交表单。

在app.json或index.json中引入组件,

"usingComponents": { 

 "van-button": "@vant/weapp/button/index"

}

按钮类型:

支持default、primary、info、warning、danger五种类型,默认为default。

  • 一个电话面试后总结 a-john 面试
    今天,接了一个电话面试,对于还是初学者的我来说,紧张了半天。 面试的问题分了层次,对于一类问题,由简到难。自己觉得回答不好的地方作了一下总结:   在谈到集合类的时候,举几个常用的集合类,想都没想,直接说了list,map。   然后对list和map分别举几个类型:   list方面:ArrayList,LinkedList。在谈到他们的区别时,愣住了
  • MSSQL中Escape转义的使用 aijuans MSSQL
    IF OBJECT_ID('tempdb..#ABC') is not null drop table tempdb..#ABC create table #ABC ( PATHNAME NVARCHAR(50) ) insert into #ABC SELECT N'/ABCDEFGHI' UNION ALL SELECT N'/ABCDGAFGASASSDFA' UNION ALL
  • 一个简单的存储过程 asialee mysql存储过程构造数据批量插入
               今天要批量的生成一批测试数据,其中中间有部分数据是变化的,本来想写个程序来生成的,后来想到存储过程就可以搞定,所以随手写了一个,记录在此:            DELIMITER $$ DROP PROCEDURE IF EXISTS inse
  • annot convert from HomeFragment_1 to Fragment 百合不是茶 android导包错误
    创建了几个类继承Fragment, 需要将创建的类存储在ArrayList<Fragment>中; 出现不能将new 出来的对象放到队列中,原因很简单;     创建类时引入包是:import android.app.Fragment;      创建队列和对象时使用的包是:import android.support.v4.ap
  • Weblogic10两种修改端口的方法 bijian1013 weblogic端口号配置管理config.xml
    一.进入控制台进行修改    1.进入控制台:  http://127.0.0.1:7001/console     2.展开左边树菜单         域结构->环境->服务器-->点击AdminServer(管理) &
  • mysql 操作指令 征客丶 mysql
    一、连接mysql 进入 mysql 的安装目录; $ bin/mysql -p [host IP 如果是登录本地的mysql 可以不写 -p 直接 -u] -u [userName] -p 输入密码,回车,接连; 二、权限操作[如果你很了解mysql数据库后,你可以直接去修改系统表,然后用 mysql> flush privileges; 指令让权限生效] 1、赋权 mys
  • 【Hive一】Hive入门 bit1129 hive
    Hive安装与配置 Hive的运行需要依赖于Hadoop,因此需要首先安装Hadoop2.5.2,并且Hive的启动前需要首先启动Hadoop。   Hive安装和配置的步骤   1. 从如下地址下载Hive0.14.0   http://mirror.bit.edu.cn/apache/hive/    2.解压hive,在系统变
  • ajax 三种提交请求的方法 BlueSkator Ajaxjqery
    1、ajax 提交请求 $.ajax({ type:"post", url : "${ctx}/front/Hotel/getAllHotelByAjax.do", dataType : "json", success : function(result) { try { for(v
  • mongodb开发环境下的搭建入门 braveCS 运维
      linux下安装mongodb 1)官网下载mongodb-linux-x86_64-rhel62-3.0.4.gz 2)linux 解压  gzip -d mongodb-linux-x86_64-rhel62-3.0.4.gz; mv mongodb-linux-x86_64-rhel62-3.0.4 mongodb-linux-x86_64-rhel62-
  • 编程之美-最短摘要的生成 bylijinnan java数据结构算法编程之美
    import java.util.HashMap; import java.util.Map; import java.util.Map.Entry; public class ShortestAbstract { /** * 编程之美 最短摘要的生成 * 扫描过程始终保持一个[pBegin,pEnd]的range,初始化确保[pBegin,pEnd]的ran
  • json数据解析及typeof chengxuyuancsdn jstypeofjson解析
    // json格式 var people='{"authors": [{"firstName": "AAA","lastName": "BBB"},' +' {"firstName": "CCC&
  • 流程系统设计的层次和目标 comsci 设计模式数据结构sql框架脚本
                                  流程系统设计的层次和目标  
  • RMAN List和report 命令 daizj oraclelistreportrman
    LIST 命令 使用RMAN LIST 命令显示有关资料档案库中记录的备份集、代理副本和映像副本的 信息。使用此命令可列出: • RMAN 资料档案库中状态不是AVAILABLE 的备份和副本 • 可用的且可以用于还原操作的数据文件备份和副本 • 备份集和副本,其中包含指定数据文件列表或指定表空间的备份 • 包含指定名称或范围的所有归档日志备份的备份集和副本 • 由标记、完成时间、可
  • 二叉树:红黑树 dieslrae 二叉树
        红黑树是一种自平衡的二叉树,它的查找,插入,删除操作时间复杂度皆为O(logN),不会出现普通二叉搜索树在最差情况时时间复杂度会变为O(N)的问题.     红黑树必须遵循红黑规则,规则如下     1、每个节点不是红就是黑。     2、根总是黑的  &
  • C语言homework3,7个小题目的代码 dcj3sjt126com c
    1、打印100以内的所有奇数。 # include <stdio.h> int main(void) { int i; for (i=1; i<=100; i++) { if (i%2 != 0) printf("%d ", i); } return 0; }  2、从键盘上输入10个整数,
  • 自定义按钮, 图片在上, 文字在下, 居中显示 dcj3sjt126com 自定义
    #import <UIKit/UIKit.h> @interface MyButton : UIButton -(void)setFrame:(CGRect)frame ImageName:(NSString*)imageName Target:(id)target Action:(SEL)action Title:(NSString*)title Font:(CGFloa
  • MySQL查询语句练习题,测试足够用了 flyvszhb sqlmysql
    http://blog.sina.com.cn/s/blog_767d65530101861c.html 1.创建student和score表 CREATE  TABLE  student ( id  INT(10)  NOT NULL  UNIQUE  PRIMARY KEY  , name  VARCHAR
  • 转:MyBatis Generator 详解 happyqing mybatis
      MyBatis Generator 详解 http://blog.csdn.net/isea533/article/details/42102297   MyBatis Generator详解 http://git.oschina.net/free/Mybatis_Utils/blob/master/MybatisGeneator/MybatisGeneator.
  • 让程序员少走弯路的14个忠告 jingjing0907 工作计划学习
      无论是谁,在刚进入某个领域之时,有再大的雄心壮志也敌不过眼前的迷茫:不知道应该怎么做,不知道应该做什么。下面是一名软件开发人员所学到的经验,希望能对大家有所帮助   1.不要害怕在工作中学习。 只要有电脑,就可以通过电子阅读器阅读报纸和大多数书籍。如果你只是做好自己的本职工作以及分配的任务,那是学不到很多东西的。如果你盲目地要求更多的工作,也是不可能提升自己的。放
  • nginx和NetScaler区别 流浪鱼 nginx
    NetScaler是一个完整的包含操作系统和应用交付功能的产品,Nginx并不包含操作系统,在处理连接方面,需要依赖于操作系统,所以在并发连接数方面和防DoS攻击方面,Nginx不具备优势。 2.易用性方面差别也比较大。Nginx对管理员的水平要求比较高,参数比较多,不确定性给运营带来隐患。在NetScaler常见的配置如健康检查,HA等,在Nginx上的配置的实现相对复杂。 3.策略灵活度方
  • 第11章 动画效果(下) onestopweb 动画
    index.html <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/
  • FAQ - SAP BW BO roadmap blueoxygen BOBW
    http://www.sdn.sap.com/irj/boc/business-objects-for-sap-faq   Besides, I care that how to integrate tightly.   By the way, for BW consultants, please just focus on Query Designer which i
  • 关于java堆内存溢出的几种情况 tomcat_oracle javajvmjdkthread
    【情况一】:    java.lang.OutOfMemoryError: Java heap space:这种是java堆内存不够,一个原因是真不够,另一个原因是程序中有死循环;   如果是java堆内存不够的话,可以通过调整JVM下面的配置来解决:   <jvm-arg>-Xms3062m</jvm-arg>   <jvm-arg>-Xmx
  • Manifest.permission_group权限组 阿尔萨斯 Permission
    结构 继承关系 public static final class Manifest.permission_group extends Object java.lang.Object android. Manifest.permission_group 常量 ACCOUNTS 直接通过统计管理器访问管理的统计 COST_MONEY可以用来让用户花钱但不需要通过与他们直接牵涉的权限 D