展开

关键词

uni-id入门(三)---初始化uni-id(创建uni-id实例)

上篇文章我们讲了准备工作 包括引入uni-id以及uni-id配置 那么这篇文章我们来代大家了解如何初始化uni-id 文档地址 https:uniapp.dcloud.iouniClouduni-id 我们的视频教程(免费)链接为https:static-b5208986-2c02-437e-9a27-cfeba1779ced.bspapp.com 由于考研所以可能文章比较短也是为了拆分每一步操作 创建uni-id 实例新建云函数管理云函数的依赖选中uni-id确定 实例创建代码如下use strict;const uniIDs = require(uni-id)exports.main = async (event uniID = uniIDs.createInstance({ context: context }) 返回数据给客户端 return event};解释const uniIDs = require(‘uni-id ’) 引入uni-id 为什么要写 uni-id 因为package.json中依赖配置为(学过node可跳过) const uniID = uniIDs.createInstance({ context

6420

uni-app(1.helloworld)

1.什么是uni-app1.Union Application 聚合App2.前端框架3.基于Vue.js4.开发规范同小程序5.一套代码可编译到ios、安卓、H5、小程序等多个平台。 2.为什么使用uni-app1.同一套代码编译多端2.接近原生,效果更好3.开发效率高4.开发成本(人力、时间、维护)低5.学习成本低6.支持npm与自定义组件7.社区活跃,版本迭代快3.HbuilderX1 .uni-app开发的工具,官网:https:www.dcloud.io2.下载安装3.hello world新建项目?

12010
  • 广告
    关闭

    腾讯云前端性能优化大赛

    首屏耗时优化比拼,赢千元大奖

  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    unicloud进阶uni-id入门(一)---uni-id能做什么?

    我们开发应用一般都需要开发用户管理模块 包括注册登陆手机验证码 手机、邮箱绑定等 uni-id可以让你轻松或者上面那么多的功能 如下图 这是我毕业设计的一部分 多端共享一个用户体系 > uni-id让前端开发人员也能快速做出一个后台 非常方便这个专栏就带大家使用uni-id 由于要写毕设和论文 所以会更新很慢 如果你对云开发感兴趣 可以加入交流群 974178910 535620886我也尝试直播给大家讲uniCloud的使用以及 uni-id的使用 我还没毕业 会有很多不足 希望大佬多多指出 谢谢

    7720

    (1)前端框架uni-app

    前端框架uni-app 可编译到iOS、Android、H5、小程序等多个平台一套代码编到7个平台? image.pngHBuilderX内置相关环境HBuilderX:官方IDE下载地址 uni-app支持通过 HBuilderX可视化界面、vue-cli命令行两种方式快速创建项目?image? image发布的快捷键是Ctrl+u通过 vue-cli 创建 uni-app 项目全局安装vue-clinpm install -g @vuecli创建uni-appvue create -p dcloudiouni-preset-vue image选择自定义模板时,需要填写 uni-app 模板地址运行发布npm run dev:%PLATFORM%npm run build:%PLATFORM%? image.png看完《uni-app官方教程》白话uni-app《uni-app 商业级应用实战》《uni-app 跨平台应用开发教程》《uni-app 实战教程 - “悦读”项目实战》《uni-app

    1.1K50

    uni-app入门教程(1)uni-app简介、部署和目录结构

    前言本文主要介绍了uni-app的基本情况,并引导快速创建和运行第一个uni-app项目,同时对项目的目录结构和代码规范进行详细说明,适合uni-app零基础初学者。 一、uni-app介绍uni-app是DCloud官方推出的重要产品,是一个使用Vue.js开发跨平台应用的前端框架,官网是http:uniapp.dcloud.io。 uni-app打包到App时仍然使用了5+引擎,5+的所有能力都可以在uni-app中可以使用,在App端运行性能和微信小程序基本相同。 为方便开发者体验uni-app的组件、接口、模板,DCloud发布了Hello uni-app演示程序,实现了一套代码同时发布到iOS、Android、微信小程序三端,可以使用手机扫描下图App码下载iOS 2.创建和运行项目创建项目可以点击工具栏里的文件- 新建->项目,并选择uni-app,输入project名,如hello uniapp,点击创建,即可成功创建uni-app,也可以点击从模版创建,选择

    1.1K40

    uni-app首页样式分享

    __mask.ani { transition: all .3s } .uni-popup__mask.uni-bottom, .uni-popup__mask.uni-center, .uni-popup } .uni-popup__wrapper.ani { transition: all .3s } .uni-popup__wrapper.top { top: 0; left: 0; width: : relative; box-sizing: border-box } .uni-popup__wrapper.uni-custom .uni-popup__wrapper-box { padding : 30upx; background: #fff } .uni-popup__wrapper.uni-custom.center .uni-popup__wrapper-box { position: .uni-popup__wrapper-box, .uni-popup__wrapper.uni-custom.top .uni-popup__wrapper-box { width: 100%; max-height

    32640

    uni-app跨域解决

    记一下uni-app预览到H5时跨域问题 配置uni-app 中 manifest.json->h5->devServermanifest.jsonjsonh5: { devServer: { port

    2.8K30

    uni-app 组件

    view scroll-view swiper text rich-text progress

    34830

    uni-app JSON.stringfly bug

    问题:uni.redirectTo() 页面跳转中,使用上页 请求 数据 (Array)。不想使用全局变量,所以用官方的 ¶ms = '' 方式进行传...

    65110

    uni-app学习

    学习uni-app1.1. 概述号称一次编写多端运行的前端框架,架构图如下?对某些不同平台的特殊功能,可以通过条件进行自动编译,也就是写两套代码,不同的环境会选择不同代码编译1.2. 解决办法就是去掉原来错误的路径 uni-app官方地址 1.4.

    78710

    uni-app 快速上手指南

    在公司基础过一点点 uni-app 不得不说的是,开发效率实际上是非常高的,官方完善速度和社区相对来说也还算不错。 考虑到独立APP 的开发效率已经时间等投入,最终还是选择了 uni-app 并优先考虑微信小程序,后期再发布webapp式移动应用。 所以准备开一个系列,来说一下非0基础,即有Web开发或者后端开发的开发人员,如何快速上手 uni-app 的开发。 路由和页面跳转归根到底,uni-app 的本质是 web 应用,因此,对于 web 应用而言,最重要的就是路由和页面间的跳转。 路由先说 uni-app 的路由,和 vue 类似, uni-app 的路由文件编写在项目根目录中的 pages.json 文件中,先来看一下改文件的结构:{ pages : , globalStyle

    58410

    uni-app采坑记录

    1. uni-app采坑记录1.1. 前言这里记录下uni-app实践中踩的坑1.2. 坑点1.2.1. 触发事件@longTap和@longpress这两个都表示长按触发事件,那么这两个有啥区别呢?

    36630

    uni-app实现多端开发

    市面上很多关于多端开发的框架,比较常用,流行的框架 uni-app,Chameleon(变色龙),taro这些,都可以支持多端,一套代码,8个平台支持,语法差异上,uni-app和Chameleon(变色龙 选择开发,个人比较熟悉vue,有做过小程序方面的,选择uni-app是最合适的,坑还是比较多,需要多踩坑。 uni-app底层的语法还是用到了weex,而且对应是应用市场插件种类很多,几乎能满足项目的需求,Ul库。选择uni-app的好处? 安装,配置好对应的目录就可以了,启动的时候,需要手动填写目录地址,uni-app不会自动打开百度小程序和支付宝小程序。需要手动,然后在保存的时候,就会自动刷新?  3.头条小程序因为这个头条小程序出来没有多久,uni-app做的兼容性不是很好,坑比较多,这个编辑器默认安装C盘,没得选择,也是和百度和支付宝小程序一样,必须是手动打开才行。

    77731

    uni-app开发H5使用vue-router

    uni-app没有vue-router如果要使用vue-router可以使用 uni-simple-router uni-simple-router文档地址 https:hhyang.cn 安装在uni-app 项目根目录 执行 npm install uni-simple-router进入根目录可以通过右键项目文件夹 在这里输入 cmd即可快速打开cmd执行 npm install uni-simple-router 安装即可配置路由新建router目录 在router目录下新建Index.js引入 uni-simple-router的RouterMount createRouterimport { RouterMount , createRouter} from uni-simple-router;新建路由写法和vue-router一样 注意开启完全使用vue-router开发import { RouterMount, createRouter} from uni-simple-router;import index from ..pagesindexindex.vueconst router = new createRouter

    4920

    uni-app开发H5使用vue-router

    uni-app没有vue-router如果要使用vue-router可以使用 uni-simple-router uni-simple-router文档地址 https:hhyang.cn 安装 在uni-app 项目根目录 执行 npm install uni-simple-router 进入根目录可以通过右键项目文件夹 在这里输入 cmd即可快速打开cmd 执行 npm install uni-simple-router 安装即可 配置路由 新建router目录 在router目录下新建Index.js 引入 uni-simple-router的RouterMount createRouter import { RouterMount , createRouter} from uni-simple-router; 新建路由写法和vue-router一样 注意开启完全使用vue-router开发 import { RouterMount , createRouter} from uni-simple-router;import index from ..pagesindexindex.vueconst router = new createRouter

    53000

    uni-app: 如何高效开发?

    前言本文主要是讲解Uni-App开发技巧,如何快速的撸码?如何调试Uni-App?通过本文,让小伙伴们开发出优秀的Uni-App。 Tag代码块uButtonuCheckboxuGrid:宫格,需引用uni uiuList:列表,需引用uni uiuListMediauRadiouSwiper...几乎各种组件不管是内置组件还是uni 如何调试uni appChrome 调试 H5uni-app H5调试,就和我们平常调试网页一样哦,进入 uni-app 项目,点击工具栏的运行 -> 运行到浏览器 -> 选择 Chrome,F12开始调试 uni-app的App端没有5+App那种webkit remote debug,因为uni-app的js不是运行在webview里,而是独立的jscore里。 总结本文主要是讲讲Uni App开发技巧,快速撸码技巧和调试技巧,掌握这2点,相信你可以开发出优秀的Uni App。最后,谢谢大家支持。

    1.8K30

    uni-app学习(二)

    1. uni-app学习(二)1.1. 好用css记录一定透明度的背景色background: rgba(255,255,255,.6);1.2. TabBar操作uni.hideTabBar()作用:隐藏TabBar,还有很多TabBar相关操作,参看这里可以进行红点显示,角标显示等等1.6. uni的节点选择器uni.createSelectorQuery

    59830

    uni-app插件ColorUI步骤条

    1. uni-app插件ColorUI步骤条1.1. 前言uni-app就不介绍了,前面几篇已经有所介绍,不知道的可以翻看我前面几篇博客ColorUI-uniApp是uni-app的一款ui组件,事实上就是对uni-app组件添加css,使其更加漂亮这里我抛砖引玉的介绍一下步骤条的使用

    94720

    uni-app 与 Vue H5 项目通讯

    比如:APIcloud、uni-app等等的框架。 uni-app里的web-view web-view是一个web浏览器组件,可以用来承担网页的容器,会自动铺满整个屏幕 各小程序平台,web-view 加载的 url 需要在后台配置域名白名单,包括内部再次 详细属性查看:uni-app里的web-view 通讯方法 引入SDK 嵌入的h5项目或者页面不是uni-app项目搭建的话,需要在 index.html 页面或者是当前的HTML页面引入uni-app 我们是用的Vue-cli脚手架搭建的项目,直接在 html 模板引入 Tips 这些 JS 文件是在 web-view 加载的那个 HTML 文件中引用的,而不是 uni-app 项目中的文件。 调用的时机 在引用依赖的文件后,需要在 HTML 中监听 UniAppJSBridgeReady 事件触发后,才能安全调用 uni 的 API。

    57120

    uni-app 与 Vue H5 项目通讯

    比如:APIcloud、uni-app等等的框架。 uni-app里的web-viewweb-view是一个web浏览器组件,可以用来承担网页的容器,会自动铺满整个屏幕各小程序平台,web-view 加载的 url 需要在后台配置域名白名单,包括内部再次 详细属性查看:uni-app里的web-view通讯方法引入SDK嵌入的h5项目或者页面不是uni-app项目搭建的话,需要在 index.html 页面或者是当前的HTML页面引入uni-app项目的 我们是用的Vue-cli脚手架搭建的项目,直接在 html 模板引入 Tips这些 JS 文件是在 web-view 加载的那个 HTML 文件中引用的,而不是 uni-app 项目中的文件。 调用的时机在引用依赖的文件后,需要在 HTML 中监听 UniAppJSBridgeReady 事件触发后,才能安全调用 uni 的 API。

    30830

    扫码关注云+社区

    领取腾讯云代金券