liuguochao1024的博客

原创 uni-app的热更新(安卓)

热更新的好处就不说了，直接上干活（安卓为例）1，我是用HBuilderX生成的uni-app项目，然后打包成apk。2，热更新的思路 (1)项目中有当前版本号（currentVersionID），服务器端有接口提供最新版本号（newVersionID） (2)每次进入应用，用当前版本号和最新版本号做对比，如果不一致，就进行更新 (3)下载wgt资源包，安装，重启3，下边是上边三个步骤的实现 (1)main.js中定义一个全局的变量或常量import ...

原创 递归json

getTreeData(data) { // 循环遍历json数据 for (var i = 0; i < data.length; i++) { data[i].name = data[i].orgName data[i].orgType = data[i].type if (data[i].children.length < 1) { // children若为空数组，则将child...

原创 图片和txt等文件的下载，不是预览

downLoadFile(item) { const xhr = new XMLHttpRequest() xhr.open("get", item.name)//文件的路径 xhr.responseType = "blob" xhr.onload = function() { var path = URL.createObjectURL(xhr.response) console.log(2222222222...

原创 js获取近几个月的年月

let type = 5 //近n个月的let month = new Date().getMonth() + 1 //当前月份let year = new Date().getFullYear() //今年for(let i=1;i<=type;i++){ let date = '' if(month >= i){ date = year + '-' + (month - i + 1) } else { date = (year-1) + '-' + (12.

原创 vue节流实现阻止重复点击

1，用节流的思想来实现（在一定时间内只能出发一次）Vue.directive('preventReClick',{inserted(el,binding){el.addEventListener('click',()=>{if(!el.disabled){el.disabled=truesetTimeout(()=>{el.disabled=false...

原创 elemenUI选项卡中懒加载图片不显示

现象：第三个选项卡中有图片懒加载，之后点击第三个不显示图片解决方案：给第三个选项卡中的图片加一个v-if判断条件是选项卡的v-model值等于当前选项卡的name...

原创 proxy代理解决跨域

vue项目中设置代理1,config\index.js下的dev下的proxyTable属性proxyTable: { '/look': { //以这个开头的请求 target: "http://www.xxxx.com", //配置需要跨域的IP地址(访问目标地址) secure: false, /...

原创 二维码带标题下载

PC端的系统，二维码作为图片来展示，但是现遇到下载二维码并且要在二维码上边或下边加上标题的需求初始情况：二维码的信息是一串加密的字符串，二维码的图片保存在远程云服务器的，我们页面展示的时候用的是具体的路径解决问题的步骤：一，准备使用html2canvas插件，但是发现一个问题，html2canvas把目标元素转换成canvas的时候，不能转换网络图片，这涉及到跨域问题，所以图片所在区域是空...

原创 vue项目1920和1280像素切换

我们开发过程中一般设计图的尺寸都是在1920*1080。但是开发过程中，很多人用的分辨率配置是150%的，就是说浏览器的尺寸已经变成个1280*720这个时候不仅仅开发遇到了滚动条的问题，同样要考虑到有的用户是1280*720那就左右都有滚动条的话，不美观，而且很多的响应式设计在转换过程中会出现元素布局混乱的现象，我有以下解决方案：思想就是自动缩放假设我们开发的设计图是1920*...

原创 apk签名

APK都必须经过数字签名后才能安装到设备上1，生成签名的命令（红色部分表示签名的名称，这条命令是在当前路径生成）keytool -genkey -v -keystore mytest.keystore -alias mytest -keyalg RSA -validity 20000 -keystore D:/mytest.keystore表示生成的证书及其存放路径，如果直...

原创 cordova打包遇到的四个问题

我在成功安装jdk和sdk之后，执行cordova run android命令后，遇到过四个问题1，could not find an installed version of gradle either in android studio这个问题是因为sdk某个版本后，打包需要用到gradle(这是一个自动化构建工具)，解决方法：（1）下载某个版本gradle-x.x-bin.z...

原创 fetchmatedata错误

在使用npm install 的时候会很慢，提示fetchMetadata: sill mapToRegistry uri 一个地址几个小时都安装不动1，问题发生的原因：资源问题，uri后边就是源地址2，解决方案：切换一下源地址 npm config get registry 是查询当前源地址的 (1) npm config set registry="http:...

原创 vue打包之后图标不显示的问题

build目录下utils.js添加 publicPath: '../../'if (options.extract) {return ExtractTextPlugin.extract({use: loaders,fallback: 'vue-style-loader',publicPath: '../../'})} else {return ['vue-style-loa...

原创 vue用elementUI的Table做服务器端筛选

table自带的筛选功能是做已有数据的筛选，如果做了分页，就是在当前页做筛选，数据量大的时候显然不合适，下面介绍一下怎么做服务器端筛选1，首先table本身带有一个事件@filter-change（这个事件是触发筛选的时候的事件处理）<el-table :data="peopleInfo" ref="filterTable" @filter-change="filterChan...

原创 ionic获取ios的各种权限

在config.xml文件中，<platform name="ios"></platform>标签里，添加如下代码这样在使用app的时候，就能根据你用到的功能去向用户申请使用权限 <config-file parent="NSPhotoLibraryUsageDescription" target="*-Info.plist"> ...

原创 mongodb备份和回复

备份恢复命令1，进入:cd /usr/local/src/mongodb-linux-x86_64-3.0.6/bin（mongodb的安装路径）2，备份：mongodump -h dbhost -d dbname -o dbdirectory-h： MongDB所在服务器地址，例如：127.0.0.1，当然也可以指定端口号：127.0.0.1:27017 -d： 需要...

原创 vue做语音播报功能

<template> <div> <div> <input type="text" id="ttsText"> <input type="button" id="tts_btn" @click="myplay()" value="播放"> </div> <div id="bdtts_div...

原创 使用ThemeableBrowser打开第三方网站并遇到的问题

我用的是ionic做的项目，这期间用了ThemeableBrowser打开了第三方网站，出现的问题就是在打包之后能打开但是不显示顶部的title和状态栏。下边就直接上教程1，引用插件 ionic cordova plugin add cordova-plugin-themeablebrowser npm install @ionic-native/themeab...

原创 ionic项目上传到App Store详细图解

ionic从开发到上传到app store，这个过程我大概经历了7个月，技术上的问题还是好解决的，下边总结一下上线的过程。大概分为三个步骤（下载证书、项目打包、应用上传），下边进行一个简单的步骤总结，截图的话太费事了，有需求的朋友可以加我微信liuguochao52159，进行交流。一、下载证书 1，去https://developer.apple.com/上注册账号（appl...

原创 vue打包assets的路径问题

首先说一下我的文件目录在config文件夹下的index.js中修改 assetsPublicPath: './'同样也可以达到资源的相对引用

原创 解决The property 'play' does not exist on value of type 'HTMLElement'

我开发用的是ionic+angular（这个现象是依然能运行，但是在编译的时候会报错）错误复现：1，html上有video元素2，ts中用var myvideo = document.getElementById(id);获取这个元素的dom3，myvideo.play();报这种错误解决方法：let myvedio = <HTMLVideoElement&gt...

原创 富文本编辑框vue-quill-editor的使用和优化

最近做了一个文章上传的项目，因为考虑到文章内容中有文字样式的需求和图片的插入，就做了一个富文本框的功能，我选择的插件就是vue-quill-editor，下边总结一下我在这里边踩过的坑和解决方案。分为两大部分来讲解，使用和优化一、使用1,下载插件 npm install vue-quill-editor --save2，引用 在vue的mai...

原创 WARNING: sanitizing HTML stripped some content (see http://g.co/ng/security#xss).

angular4中我用上面的绑定方式去渲染数据的我本身要渲染的数据结构如下之后就给我提示WARNING: sanitizing HTML stripped some content (see http://g.co/ng/security#xss).虽然内容能显示出来，但是字体的颜色和背景不能显示经过查询，这个是angular4的数据绑定的警告，我们需要对内容进行转换，官网...

原创 ionic3使用iframe引用外部网站

1，在configxml文件中添加     &lt;access origin="*" /&gt;      &lt;allow-intent href="*" /&gt;     &lt;allow-navigation href="*" /&gt; 2.html中加入iframe标签&lt;ion-content &gt;  &lt;iframe

原创 ionic成ipa安装之后打开白屏

这里可能是配置的问题1，条款配置文件2，ionic项目中的config.xml文件 这里的配置要对应上，比如config.xml中id  要填写成com.sanhealth.ionicname标签要填写成myionic...

原创 ionic3的页面跳转功能

最劲再用 ionic3 +  angular4 开发小程序，这期间遇到了一些坑，下边总结一下页面间跳转的文档前提 ：      （1）首先要引用“导航控制器” NavController            import { NavController} from 'ionic-angular';      （2）要在构造器中注册此控制器            constru...

原创 ionic3做本地缓存

1，现在相应的包npm install @ionic/storage@2.0.0 2，在  src\app\app.module.ts 中引入并全局定义storage模块（1）引入         import { IonicStorageModule } from '@ionic/storage';//本地缓存插件         （2）全局定义storage模块  ...

原创 Angular引入百度地图js

第一步：申请百度地图密钥，很简单，去网上随便找教程第二步：在Angular项目中引入百度地图API文件，在index.html中引入 第三部，创建一个组件html部分&lt;div id = "map" style="width:100%;height: 100%"&gt;&lt;/div&gt;js部分import { Component,OnInit } from...

原创 ionic隐藏底部tab菜单

原创 angular4数据渲染识别br标签

html部分 (仅介绍两种数据绑定方式的渲染结果)1，&lt;div&gt;{{myText}}&lt;/div&gt;2，&lt;div [innerHTML]="myText"&gt;&lt;/div&gt;ts部分aboutUsTitle = "我认为我是第一行&lt;br&gt;我认为我是第二行";结果1，我认为我是第一行&lt;br&gt;

原创 ionic轮播点击事件不触发

问题描述：轮播时，往往第一项不会触发点击事件，滑动后能执行，但是最后一项又不能执行注意事项：我的点击事件绑定在ion-slide和img上都有这个问题解决方案：直接上代码html中ts中   ==》 最后输出的index，就是banner图的索引值，从0开始 ...

原创 vue移动端用audio做背景音乐

我遇到的坑，主要就是移动端的问题和切换路由导致背景音乐暂停的问题者可以用一个套路来解决：把audio卸载index.html中，写下来上代码1，html部分2，js部分在index.html底部添加一个script标签，用来监听事件，使音乐自动播放function audioAutoPlay(id){            var audio = document.get...

原创 vue引入图片和背景图

1，引入图片，在img元素中用：src绑定地址的2，直接在样式中引用的  

原创 vue动画打包后失效

webpack 打包后动画未执行，就是npm run build后在dist中生成的项目中动画未生效 解决：找到build文件夹中 得vue-loader.conf.js,把extract的值改为false---如图...

原创 html背景音乐

audio的自动播放在IE下生效，chrome和火狐不生效宽和高都设置为0，就隐藏了&lt;audio id="myaudio" class="media-audio" src="音乐文件路径" width="0" height="0" preload loop="loop"&gt;&lt;/audio &gt;如果是应用于微信端不生效的话在

原创 页面在微信端禁止缩放

在head中加入&lt;meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /&gt;

原创 express连接mongodb数据库

这里需要做三部分的东西1，连接数据库    config文件夹下放两个文件    (1)config.js        (2)mongoose.js2，创建模型models下创建 Index.js3，创建路由  routers文件夹下放index.js(前提是这个路由再app.js中注册过)...

原创 vue调用微信API

1，下载对应的组件包    cnpm install weixin-js-sdk2,在vue的main中引入并将其挂在到vue实例上    import wx from 'weixin-js-sdk'    Vue.prototype.wx = wx3，各个组件中如果需要使用的话    输出一下this.wx就可以知道是否能掉到wx的API了...

原创 linux安装node环境

1，连接上服务器2，进到root目录    cd root3.下载node安装包(推荐使用gz格式的)    wget https://npm.taobao.org/mirrors/node/v8.9.3/node-v8.9.3-linux-x64.tar.gz4，解压缩    tar xvzf node-v8.9.3-linux-x64.tar.gz5，把node和npm添加到全局（再root目...

原创 vue自定义组件三步走

如图所示：我自定义了两个组件，一个是Head.vue,一个是Foot.vue我现在在Page01.vue中用他们两个，公分三步1，引用2，注册3，使用