uniapp 开发开发一个简单的背单词小程序-01

「这是我参与11月更文挑战的第14天，活动概况检查：2021最后一次更文挑战」

前语

如何运用uniapp云开发， 几分钟就能开发一个最简略的背单词小程序 和 h5 页面呢， 有很多人入门比较困难，我们记录下过程给我们参考

1，下载uni-starter模版

ext.dcloud.net.cn/plugin?id=5…

2，增加单词数据库表部分

• 了解 schema 语法 uniapp.dcloud.net.cn/uniCloud/sc… schema 描写数据库和 schema 语法的文档

• 增加新的schema 文件

DB Schema

DB Schema是根据 JSON 格局定义的数据结构的标准。

它有很多重要的效果：

• 描绘现有的数据意义。能够一目了然的阅读每个表、每个字段的用处。
• 设定数据操作权限(permission)。什么样的角色能够读/写哪些数据，都在这儿配置。
• 设定字段值域能接受的格局(validator)，比方不能为空、需契合指定的正则格局。
• 设定字段之间的束缚联系(fieldRules)，比方字段结束时刻需求晚于字段开始时刻。
• 设置数据的默认值(defaultValue/forceDefaultValue)，比方服务器当前时刻、当前用户id等。
• 设定多个表的字段间映射联系(foreignKey)，将多个表按一个虚拟表直接查询，大幅简化联表查询。
• 根据schema主动生成前端界面（schema2code），包含列表、概况、新建和修正页面，主动处理校验规矩。

操作如下

代码如下

{
	"bsonType": "object",
	"description":"单词表",
	"required": [],
	"permission": {
		"read": true,
		"create": true,
		"update": true,
		"delete": true
	},
	"properties": {
		"_id": {
			"description": "ID，体系主动生成"
		},
		"user_id": {
			"bsonType": "string",
			"description": "创建者",
			"forceDefaultValue": {
				"$env": "uid"
			},
			"foreignKey": "uni-id-users._id"
		},
		"en_title": {
			"bsonType": "string",
			"description": "英文单词",
			"maxLength": 20,
			"title": "英文单词",
			"required":true,
			"trim": "both"
		},
		"ch_title": {
			"bsonType": "string",
			"description": "中文单词",
			"maxLength": 20,
			"title": "中文单词",
			"required":true,
			"trim": "both"
		},
		"description": {
			"bsonType": "string",
			"description": "描绘",
			"maxLength": 500,
			"title": "描绘",
			"required":true,
			"trim": "both"
		},
		"example": {
			"bsonType": "string",
			"description": "例句",
			"maxLength": 20,
			"title": "例句",
			"required":true,
			"trim": "both"
		}
	}
}

其间。permission 答应前端操作数据库，properties 字段中的 reuired 代表是否必填

3，生成页面

• 上传shhema文件
• 运用shema 文件生成根本页面

4，适当的修正

• 修正page.json文件的tabBar 为

 "tabBar": {
        "color": "#7A7E83",
        "selectedColor": "#007AFF",
        "borderStyle": "black",
        "backgroundColor": "#FFFFFF",
        "list": [{
            "pagePath": "pages/word/list",
            "iconPath": "static/tabbar/grid.png",
            "selectedIconPath": "static/tabbar/grid_active.png",
            "text": "我的单词表"
        }, {
            "pagePath": "pages/ucenter/ucenter",
            "iconPath": "static/tabbar/me.png",
            "selectedIconPath": "static/tabbar/me_active.png",
            "text": "我的"
        }]
    }

到达躲藏下其他页面的目的

• 修正个人中心的内容为