- 博客(20)
- 资源 (1)
- 收藏
- 关注
RSS订阅原创 JS获取元素CSS的内容（简单）
众所周知const div = document.querySelect('div')const heigth = div.style.height上面代码中的height只能获取到内联样式的height，如果一开始定义在了css中，那么上述代码获取到的高度就是空。如何获取最终的样式呢？使用window.getComputedStyle(element, pseudoElement)element: 必需，要获取样式的元素pseudoElement: 可选，伪类元素，当不查询伪类元素的时候可
2022-03-13 15:36:36
1153
原创 vue3项目网站自适应大屏幕宽度（width＞1920）
vue3项目自适应屏幕宽度安装插件：lib-flexible、postcss-px2rem、px2rem-loadercnpm install lib-flexible --savecnpm install postcss-px2rem --savelib-flexible是来作为移动端适配的解决方案的，postcss-px2rem将代码中px自动转化成对应的rem的一个插件。在main.js中引入import 'lib-flexible'在vue.config.js中引入如下代码m
2022-03-03 16:42:42
5060
4
原创 VUE使用自定义指令对普通 DOM 元素进行底层操作
使用vue的自定义指令来整合某个重复使用的底层操作举个聚焦输入框的例子，如下：当页面加载时，该元素将获得焦点 (注意：autofocus 在移动版 Safari 上不工作)。事实上，只要你在打开这个页面后还没点击过任何内容，这个输入框就应当还是处于聚焦状态。现在让我们用指令来实现这个功能：// 在main.js中注册一个全局自定义指令 `v-focus`Vue.directive('focus', { // 当被绑定的元素插入到 DOM 中时…… inserted: function (el
2022-01-21 20:46:06
696
原创 vue关闭页面或刷新页面触发浏览器关闭提醒
关闭单个页面、整个浏览器、刷新都可以触发mounted() { window.onbeforeunload = e => { e = e || window.event // 兼容IE8和Firefox 4之前的版本 if (e) { e.returnValue = '关闭提示' } // Chrome, Safari, Firefox 4+, Opera 12+ , IE 9+ return '关闭提示'}...
2022-01-11 19:46:43
1927
原创 npm安装依赖失败后的没有办法的办法
安装依赖失败，但是不知道为什么，提示可能是因为nodejs的版本问题；于是我选择卸载nodejs重新安装一个版本！删除nodejs有三步要做：卸载nodejs，包括配置安装新的nodejs配置新的nodejs首先是卸载，这最重要，卸载不干净就很难解决问题！先执行nodejs自身的卸载程序，卸载；然后删除以下几个文件：你安装的nodejs文件夹C:\Users\hp\AppData\Roaming文件夹下面的npm文件夹和npm_catch文件夹(可能没有这个)删除 C:\Users
2021-12-10 15:45:43
653
原创 css3实现过渡transition动画效果
CSS3中，我们为了添加某种效果可以从一种样式转变到另一个的时候，无需使用Flash动画或JavaScript。例如在小米商城中，鼠标移到盒子上，会有一个缓慢出现的阴影，使用的就是transition属性；鼠标没放在图片上面的情况鼠标放在上面的情况鼠标放上图片 从上面变成下面这样<style>.trans { margin: 200px auto; width: 70px; height: 50px; border: 1px solid red
2021-12-10 15:35:08
741
原创 css鼠标移入 显示滚动条
.database是元素的类选择器名称.database::-webkit-scrollbar { /*这里写滚动条宽度*/ width: 6px;}.database:hover::-webkit-scrollbar-thumb:vertical { /*这里写鼠标移入时的滚动条颜色和边框样式*/ background-color: rgb(228, 228, 228, 0.5); border-radius: 10px;}鼠标未移入时鼠标移入时...
2021-08-31 20:39:57
1016
转载 centos开机启动nginx和redis
转载地址nginx启动redis启动nginx#!/bin/sh## chkconfig: 2345 10 20#nginx - this script starts and stops the nginx daemon # # chkconfig: - 85 15 # description: Nginx is an HTTP(S) server, HTTP(S) reverse \ # proxy and IMAP/POP3 proxy server
2021-08-07 17:42:22
182
原创 centos开机自启动用户脚本
开机启动用户自定义脚本方法如下：首先切换到/etc/init.d目录下我是centos8 系统，这个目录虽然在命令行可以直接进去，但是我在目录中没有找到，后来发现是在这个目录下面/etc/rc.d/init.d/，不影响事，直接cd /etc/init.d/就行了拷贝要运行的脚本文件到此目录cp 你的脚本.sh 拷贝过去的名字.sh修改init.d目录下脚本的内容#!/bin/bash# chkconfig: - 85 15# description:开机自启脚本cd /m
2021-08-07 17:04:35
575
1
原创 centos修改数据库数据存放目录
转载https://blog.csdn.net/zyw_java/article/details/78512285数据少话最好把数据库数据目录复制到新的目录，原先的不要动要先启动一次，生成基础的socket文件之后再做迁移工作日志文件中查看首次登录数据库的密码，账号默认rootmysql5.7版本还需要对 新目录的socket文件 做软连接到 旧目录的socket中使用命令：ln -s 原socket 新socket...
2021-07-28 10:49:38
116
原创 vue3 拖拽组件drag-drop
做项目的时候遇到了一个需求，拖拽按钮到指定位置，添加一个输入框。基本思路：基本按钮添加指定位置里面写好需要的输入框，只不过用v-show隐藏起来，拖拽触发条件显示输入框，同时隐藏按钮给按钮加可拖动标签，给指定位置加可放置标签拖动按钮到指定位置，改变显示条件，输入框显示出来，按钮消失首先安装插件 vue-drag-dropcnpm install --save vue-drag-drop然后引入插件import VueDragDrop from 'vue-drag-drop'Vue
2021-07-09 19:22:30
6475
1
原创 js点击按钮获取当前按钮的信息
点击按钮获取按钮信息<el-button id="where" type="primary" plain @click="button($event)">WHERE</el-button>button(event) { // 获取点击对象 var el = event.currentTarget console.log(el) console.log(el.id)} ...
2021-07-07 13:12:55
2538
原创 vue2中使用 vue-i18n 插件实现页面中英文切换——记录
安装vue脚手架，略安装插件npm install vue-i18n，建议使用cnpm在src文件夹下创建lang文件夹存放中英文的语言包。 en.js是英文包，zh.js是中文包，还可以添加其他的语言包，index.js后面贴图index.js文件中的内容：import Vue from 'vue' // 引入vueimport VueI18n from 'vue-i18n' // 引入i18n模块import elementEnLocale from 'element-u..
2021-06-30 00:36:27
1136
5
原创 vue3安装wot-design步骤
首先把vue项目创建好安装wot-designcnpm i wot-design 我用npm安装报错了。。。见怪不怪了接着在main.js中引入依赖import WotDesign from 'wot-design'import 'wot-design/lib/theme-default/index.css'//全局引入，可以直接在组件中写wot-design官网的标签了Vue.use(WotDesign)wot-deign官网直接在代码块中引入即可看到效果<wd..
2021-06-10 17:20:21
590
2
原创 vue项目打包做app模拟真机测试 无法请求后台服务接口（axios配置）
vue项目打包做app模拟真机测试 无法请求后台服务接口背景：本地的测试使用的是反向代理，可以不用管目标地址问题，但是打包成apk测试却不可以，需要使用目标地址，而且在开发的代码中无法实现跨域，打包后是找不到接口的原本的写法：//配置http.js文件import axios from 'axios'const instance = axios.create({ timeout: 60000, headers: { 'Content-Type': 'application/jso
2021-04-14 18:25:41
1786
原创 vue项目打包成安卓APP禁用某个页面的物理返回按钮
上一个文章记录了 如何解决使用Hbuilderx打包Vue项目为安卓APP点击物理返回键直接退出应用问题，这篇文章记录一下让某个页面禁用物理返回按钮的问题问题描述上次解决了返回按钮，但是在登录成功之后还是可以返回到登录界面，这明显不合适，只能让用户点退出登录才可以返回到登录页面。即物理按钮禁用，但是不影响页面内的回退跳转。解决思路使用history.pushState()方法向当前浏览器会话的历史堆栈中添加一个状态（state）描述：从某种程度来说, 调用 pushState() 和 window
2021-04-06 17:14:46
711
原创 解决使用Hbuilderx打包Vue项目为安卓APP点击物理返回键直接退出应用问题
已解决：使用Hbuilderx打包Vue项目为安卓APP点击物理返回键直接退出应用问题描述解决思路开始操作问题描述使用vue框架写的项目，打包之后用Hbuilderx打包成了apk文件，在安卓手机上测试时发现点击安卓的物理返回按钮时会直接杀死应用。解决思路如果没有上一个路由地址则直接退出应用，如果有则返回到上一个路由地址的页面。开始操作找到文件的index.js文件，在<title></title>代码下面添加一段代码<script> document
2021-04-06 16:58:45
1220
原创 vue3.0实现移动端自适应
vue3.0实现移动端自适应项目使用vue3.0编写代码，说要打包成apk文件，在安卓上看，现在需要适配移动端的样式，记录一下，亲测有效。安装插件vue脚手架略过lib-flexible : 会自动在html的head中添加一个<meta name="viewport">的标签，同时会自动设置html的font-size为屏幕宽度除以10，也就是1rem等于html根节点的font-size。假如设计稿的宽度是750px，此时1rem应该等于75px。假如量的某个元素的宽度是150px
2021-04-01 14:05:42
5922
1
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人