uniapp 用 vue-cli 脚手架搭建项目模板
第一步 安装环境全局安装
1npm install -g @vue/cli
第二步 创建一个文件夹创建个 testFile 文件夹 cmd打开小黑窗。输入如下指令( my-project 是项目的名称 ):
1vue create -p dcloudio/uni-preset-vue my-project
第三步 选择模板选择第一个默认模板 enter 等待文件生成;
生成后将文件导入到HBuilderX中就可以看到模板的整体结构了。
uniapp 中 #ifdef #ifndef #endif 条件编译
条件编译条件编译是用特殊的注释作为标记,在编译时根据这些特殊的注释,将注释里面的代码编译到不同平台。
写法
说明
#ifdef
if defined 仅在某平台存在
#ifndef
if not defined 除了某平台均存在
%PLATFORM%
平台名称
#ifend
结尾,结束编译
#ifdef #ifndef 使用1234567891011121314151617181920212223242526272829303132333435<template> <!-- #ifdef APP-PLUS --> 在App平台下会编译的代码 <!-- #endif --> </template><script> // #ifdef APP-PLUS 在App平台下会编译的代码 // #endif // #ifndef APP-PLUS 除了在App以外平台 都会编译的代码 // #endif // #ifdef APP-PLUS || HS 在 App平台 或 H5平台 下会编译的代码 // ...
uniapp 给H5网站添加图标favicon.icon
需求介绍项目上线了,但是没有自己的个性图标怎么行,必须得咱H5导航栏整一个。
解决步骤
新建一个HTML文件 uniapp H5项目生成时本身是没有 index.html 等相关HTML文件,而图标又是要在HTML文件中设置。
现在我们在根目录下创建一个 count.html 文件(文件名按个人喜好来,个人因为关于百度统计方案中创建过这个文件。)
给 H5 设置配置为了让 count.html 文件能够被编译,展示。我们可以这样做:
当然也可以直接修改源码视图:
编写 count.html 内容1234567891011121314151617181920212223<html lang="zh-CN"> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta n ...
uni统计、uniapp统计简单实现教程
uni 统计介绍uni-app 自 2.2.3版本开始新增 uni 统计,支持全平台业务统计,包括App、H5及各家小程序。点击官方介绍 好了介绍结束
配置统计现在以H5为例;
第一步、打开配置开关项目中打开 manifest.json => uni统计配置 => 启用H5平台
或者 打开 manifest.json => 源码视图 => “H5” 中设置
123"uniStatistics" : { "enable" : true}
第二步、创建DCloud AppID
通过 HBuilderX 获取Appid。
DCloud开发者中心 获取Appid。
将获得的AppID 填写入基础配置中
第三步、打包提交新版本登录 uni统计页面 查看统计数据。
uniapp 本地缓存剩余时间
封装代码在项目根目录项新建 utils 文件夹;再新建一个 idea.js 文件;
1234567891011121314151617181920212223import store from "./store.js"module.exports = { // 计算剩余时间 timeRemaining(val,time) { return new Promise((resolve, reject) => { let newTime = new Date().getTime(); let oldTime = store.getItem(val); if (oldTime) { if (newTime > oldTime + time*1000) { resolve(0); } else { let downtime = Math.ceil(time + (oldTime - newTime) / 1000); resolve(dow ...