实践求真知

一点睛1官网：http://uniapp.dcloud.io/component/README?id=uniui2说明以Calendar日历组件为例进行说明二实例1导入插件2项目中导入该插件3导入后的效果三代码<template> <view class="content"> <!-- 1 父组件给子组件传值——设参 --> <!-- 3 子给父传参 --> <test ...

一点睛组件间传值包括下面三种情况： 父组件给子组件传值 子组件给父组件传值 兄弟组件通讯 二代码1父组件index.vue<template> <view class="content"> <!-- 1 父组件给子组件传值——设参 --> <!-- 3 子给父传参 --> <test v-if="flag" :title="title" @myEvent="getNum"></...

一点睛在uni-app中，可以通过创建一个后缀名为vue的文件，即创建一个组件成功，其他组件可以将该组件通过import的方式导入，再通过components进行注册即可。二代码1创建test.vue组件<template> <view id="myview"> 这是test组件{{num}} </view></template><script> export default { data() { ...

一官网1 声明式跳转http://uniapp.dcloud.io/component/navigator2编程式跳转http://uniapp.dcloud.io/api/router?id=navigatetohttp://uniapp.dcloud.io/api/router?id=switchtab二代码1新建navigator.vue<template> <view> <view>导航跳转的学习</view...

一点睛1官网http://uniapp.dcloud.io/platform?id=%E8%B7%A8%E7%AB%AF%E5%85%BC%E5%AE%B9二代码1修改phone.vue<template> <view> <button type="primary" @click="updatePhoto">上传图片</button> <image v-for="item in imgArr" :src="ite...

一点睛1 官网： http://uniapp.dcloud.io/api/media/image2核心APIuni.chooseImage(OBJECT) uni.previewImage(OBJECT)二代码1新建photo.vue<template> <view> <button type="primary" @click="updatePhoto">上传图片</button> <image v-for=...

一点睛官网地址： http://uniapp.dcloud.io/api/storage/storage?id=setstorage二实战<template> <view> <view> <button type="primary" @click="setStorage">缓存数据</button> </view> <view>..

一点睛官网地址： http://uniapp.dcloud.io/api/request/request二代码<template> <view> <view> <button @click="getData">发送get请求</button> </view> <view>这是列表页</view> &l..

目录一下拉刷新说明二下拉刷新实战1修改pages.json2新建list.vue3效果三上拉加载说明四上拉加载实战1修改list.vue2修改pages.json3效果一下拉刷新说明onPullDownRefresh：监听用户下拉动作，一般用于下拉刷新。有两种方式触发下拉刷新。需要在 pages.json 里，找到的当前页面的pages节点，并在 style 选项中开启 enablePullDownRefresh。 un...

目录一点睛1 应用生命周期2 页面声明周期二应用生命周期实战1修改 App.vue2观察控制台打印三页面声明周期实战1修改index.vue2修改路由pages.json3效果一点睛1 应用生命周期生命周期的概念：一个对象从创建、运行、销毁的整个过程被称为称为生命周期。生命周期函数：在生命周期中每个阶段会伴随着某个函数的触发，这些函数被称为生命周期函数。 函数名 说明 onLau...

一代码1新建 home.vue<template> <view> <view > 数据绑定的学习 </view> <view>{{msg}}</view> <view>{{'你好'+'世界'}}</view> <view>{{1+1}}</view> ..

一点睛 rpx即响应式px，一种根据屏幕宽度自适应的动态单位。以750宽的屏幕为基准，750rpx恰好为屏幕宽度。屏幕变宽，rpx实际显示效果会等比放大。 使用@import语句可以导入外联样式表，@import后跟需要导入的外联样式表的相对路径，用；表示语句结束。 支持基本常用的选择器class、id、element等。 在uni-app中不能使用*选择器。 page相对于body节点。 定义在App.vue中的样式为全局样式，作用于每一个页面，在.

一text组件1代码<template> <view> <view> <text>唱歌跳舞打篮球</text> </view> <view> <text selectable>唱歌跳舞打篮球</text> </view> <view&g..

一点睛通过启动模式配置可以在开发时直达要进入的页面。本例通过condition配置，直达详情页。二代码1新增 detail.vue详情页<template> <view>详情页</view></template><script></script><style></style>2pages.json中配置condition{ "pages":...

一点睛当设置 position为top时，将不会显示icon。tabBar中的list是一个数组，只能配置最少2个，最多5个 tab ，tab按数组的顺序排序。二代码1配置pages.json{ "pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages { "path": "pages/message/message"...

一新建 message.vue文件<template> <view> hello-uni </view></template><script></script><style></style>二修改 pages.json文件{ "pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud...

一官网http://uniapp.dcloud.io/二环境搭建1HBuilder：前端开发工具2微信开发者工具：微信小程序运行环境下载地址： https://developers.weixin.qq.com/miniprogram/dev/devtools/download.html三入门项目新建项目四运行方式1在google浏览器运行运行位置运行效果2在微信开发者工具中运行运行位置运行效果3运行在手机中...