uni-app进阶之模版语法与数据绑定【day7】

简介: uni-app进阶之模版语法与数据绑定【day7】

在这里插入图片描述

模版语法与数据绑定

模板语法:使用双大括号“{绑定变量}}}”
数据绑定:使用双大括号“{{绑定变量}}}”与Data(){}函数中返回{}的数据绑定
动态绑定:使用v-bind指令绑定要绑定的属性(v-bind缩写::)
双向绑定:使用V-model指令

<view v-bind:class="className">
    hello uni-app
</view>

打开hbuilderx,点击左上角的“hbuilderx”->“preferences”打开“settings.json”,点击“run configuration”,下拉找到“applet run configuration”,点击右侧的“Browse”找到开发者工具路径(或手动填写开发者工具路径)

Onlaunch和Onshow是常用的
Uni app支持以下应用程序生命周期功能:onlaunch、Onshow、onhide、onerror、onuninviewmessage、onunhandledrejection、onpagenotfound、onTheChange

    // App.vue使用方法
    export default {
            // 当uni-app初始化完成时触发(全局只触发一次)
            onLaunch: function() {
            },
            // 当uni-app启动,或从后台进入前台显示
            onShow: function() {
            },
            // 当uni-app从前台进入后台
            onHide: function() {
            },
            // 当uni-app报错时触发
            onError: function() {
            },
            // 对nvue页面发送的数据进行监听
            onUniNViewMessage: function() {
            },
            // 对未处理的 Promise 拒绝事件监听函数
            onUnhandledRejection: function() {
            },
            // 页面不存在监听函数
            onPageNotFound: function() {
            },
            // 监听系统主题变化
            onThemeChange: function() {
            },
            
    }

认识 uniCloud

Unicloud是一个基于无服务器模式和JS编程的云开发平台,由dccloud联合阿里云和腾讯云为uni应用开发人员提供
Unicloud使用JavaScript开发整个前台和后台业务,这对前端开发人员很友好
Unicloud使开发人员能够专注于业务开发,而无需关心服务器的操作和维护
对于非H5、无域名服务器

云函数

云函数是在云中运行的函数(服务器端)。每次修改云功能时,都必须上载并部署它才能工作
事件是客户端上传的参数
Context包含调用信息和运行状态,并获取每个调用的上下文

'use strict';
exports.main = async (event, context) => {
    //event为客户端上传的参数
    console.log('event : ', event)
    
    //返回数据给客户端
    return event
};

可以使用uni Callfunction({})调用云函数

methods: {
    函数名() {
        uniCloud.callFunction({
            name: "云函数名",
            data: {},
            success(res) {},
            fail(err) {}
        })
    }
}

Unicloud提供JSON格式的文档数据库。数据库中的每个数据都是JSON格式的对象。数据库可以有多个集合
数据是标准JSON代码,字符串需要使用双引号
出于安全考虑,云数据库只能在云函数中调用,不能在客户端进行添加、删除、修改或查询
在云函数中,可以使用unicloud Database()获取对数据库的引用
可以通过数据库集合()get引用集合
新数据:集合添加()
删除数据:收款单(“此记录的id”)删除()
修改数据:收款单('id of this record')Update()或收款单('id of this record')set()
Update():只能使用现有ID更新记录。更新没有现有ID的记录失败
Set():记录存在时更新;如果不存在,请添加

相关文章
|
7月前
|
移动开发 小程序 JavaScript
Uniapp 中,能够同时兼容H5、web、app、微信小程序的引入高德地图的语法格式
Uniapp 中,能够同时兼容H5、web、app、微信小程序的引入高德地图的语法格式
708 0
|
4月前
|
前端开发 JavaScript 安全
[译] 定制 create-react-app:如何制作自己的模版
[译] 定制 create-react-app:如何制作自己的模版
|
7月前
|
存储 搜索推荐 安全
app注册协议通用模版
app注册协议通用模版
46 1
|
JavaScript 开发者
uni-app入门:WXML数据绑定
WXML全称:wexin markup language,微信标签语言,可以理解为web中的html,今天来讲一下数据绑定,通过几个小案例掌握基本的使用,以下均以index页面进行讲解。 一般是在.js文件中进行数据设置,所有的数据均在page对象中的data属性中进行设置,key-value形式进行设置,其中value可以是字符串、对象、集合。wxml中进行数据展示,其中使用{{}}差值表达式进行获取数据信息。
uni-app入门:WXML数据绑定
|
JavaScript 前端开发 网络协议
Frida - App逆向 JavaScript代码注入 常用语法介绍
Frida可以通过将JavaScript 脚本插入到APP的内存中来对APP的逻辑进行跟踪和监视乃至修改原程序的逻辑,实现逆向开发和分析人员想要实现的功能称之为HOOK(钩子 即通过钩子机制与钩子函数建立联系);
1196 0
Frida - App逆向 JavaScript代码注入 常用语法介绍
|
JSON 移动开发 前端开发
uni-app进阶之模版语法与数据绑定【day7】
uni-app进阶之模版语法与数据绑定【day7】
Uni-App - 模板语法 - 数据绑定
Uni-App - 模板语法 - 数据绑定
236 0
|
2月前
|
小程序 JavaScript 前端开发
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
uni-app开发微信小程序:四大解决方案,轻松应对主包与vendor.js过大打包难题
740 1

热门文章

最新文章

下一篇
DataWorks