分类 前端技术 下的文章

问题描述：只能用http://localhost:8080访问项目,不能用http://本机IP:8080访问解决方案一：webpack dev配置文件中加上host:'0.0.0.0' 解决方案二：在 npm run dev 时添加参数 --host 0.0.0.0即可或者在webpack的package.json"scripts": { "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --host - 阅读剩余部分 -

根据js对象的浅拷贝来实现数组的自我递归调用来实现数据排序排序前图排序后图代码直接贴上，喜欢研究的自己可以研究下，很有意思的。<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>根据对象的浅拷贝来实现对数组的排序</title> </head> <body> <script src="sortJson.js&quo- 阅读剩余部分 -

1. 数组转字符串.join() 将数组中所有元素放到一个字符串中，并用指定的分隔符进行分割const a = [1, 2, 3] a.join(',') // "1,2,3" a.join('_') // "1_2_3" 2. 字符串转数组.split() 将字符串以指定的分隔符分割成数组const a = '720_1_6' a.split('_') // [720, 1, 6]

一、普通数组排序　　js中用方法sort()为数组排序。sort()方法有一个可选参数，是用来确定元素顺序的函数。如果这个参数被省略，那么数组中的元素将按照ASCII字符顺序进行排序。如：var arr = ["a", "b", "A", "B"]; arr.sort(); console.log(arr);//["A", "B", "a", "b"] 因为字母A、B的ASCII值分别为65、66，而a、b的值分别为- 阅读剩余部分 -

最近调试程序遇到了个net::ERR_UNSAFE_PORT 开始以为是跨域问题后来百度才发现是浏览器端口限制问题不想修改浏览器设置的就改用其它端口吧，搜索了一下，Firefox也有类似的端口限制；如果非要使用类似的端口，我们要做的是允许访问非常规端口地址，解决办法：选中Google Chrome 快捷方式，右键属性，在”目标”对应文本框添加：--explicitly-allowed-ports=87,6666,556,6667 允许多个端口以逗号隔开，最终如下：C:\Users\Huoqing\AppData\Local\Google\Chrome\Applicatio- 阅读剩余部分 -

　浏览器渲染页面的方式各不相同，甚至同一浏览器的不同版本（“杰出代表”是 IE）也有差异。因此，浏览器兼容成为前端开发人员的必备技能。如果有一份浏览器 Hack 手册，那查询起来就方便多了。这篇文章就向大家分享 Browserhacks 帮我们从网络上收集的各个浏览器特定的 CSS & JavaScript Hack，记得推荐和分享啊！IE 选择器 Hack/* IE 6 and below */ * html .selector {} .suckyie6.selector {} /* .suckyie6 can be any unused class */ /* I- 阅读剩余部分 -

方法一：在router/indexs.js文件下配置路由import Vue from 'vue' import Router from 'vue-router' Vue.use(Router) export default new Router({ mode: 'history',// 使用 HTML5 的 History 路由模式，通过‘/’设置路径 routes: [ { path: '/', name: 'index', component: (resolve) => require(['@/page/i- 阅读剩余部分 -

原文：5 Vuex Plugins For Your Next VueJS Project 作者：Anthony Gore使用 Vuex 来管理 Vue 的状态，有很多好的理由。其中之一就是，通过 Vuex 插件可以非常容易的扩展一些很酷的功能。Vuex 社区中的开发人员已经创建了大量的免费插件供你使用，有许多你能想象的功能，还有一些你可能没有想到的功能。在本文中，将向你展示5个特性，你可以通过 Vuex 插件轻松地添加到下一个项目中。状态持久化同步标签页、窗口语言本地化管理多个加载状态缓存操作状态持久化vuex-persistedstate 使用浏览器的本地存储（ loc- 阅读剩余部分 -

Vuex 解决了多视图之间的数据共享问题。但是运用过程中又带来了一个新的问题是，Vuex 的状态存储并不能持久化。也就是说当你存储在 Vuex 中的 store 里的数据，只要一刷新页面，数据就丢失了。引入vuex-persist 插件，它就是为 Vuex 持久化存储而生的一个插件。不需要你手动存取 storage ，而是直接将状态保存至 cookie 或者 localStorage 中。具体用法如下：安装：npm install --save vuex-persist or yarn add vuex-persist 引入：import VuexPersistence f- 阅读剩余部分 -

最近在修复IE10,11浏览器的bug，今天下午我F12准备调试js的时候，竟然发现控制台报错了！网上搜索了半天，解决方案如下：http://www.microsoft.com/en-US/download/details.aspx?id=45154 （64位）http://www.microsoft.com/en-US/download/details.aspx?id=45134  （32位）

　最近测试给了我一大堆BUG，一瞅发现全是IE11的。吐槽一下这个浏览器真的比较特立独行。很多默认的样式跟别的浏览器不同，而且最明显的一点应该是padding左右内边距往往比别的浏览器大了一倍。但是当需要修改的时候又头疼了。如果改变原有的padding值，那么在IE11生效了。别的浏览器又有问题了。于是在网上搜了一下有没有专门针对IE11的CSShack，就是只对IE11生效的CSS样式，一查还真有。就是在CSS样式文件中加一个@media screen and(-ms-high-contrast:active),(-ms-high-contrast:none){里面是你的- 阅读剩余部分 -

好久不写文章了，做个element-ui的总结，会持续更新element-ui的table列超出部分省略加悬浮提示<el-table-column :show-overflow-tooltip="true"> </el-table-column> 表单取消重置this.$refs.companyInfoForm.resetFields() input绑定回车事件*一般监听在输入的input监听keyup事件，加enter修饰符。如果input是组件，加上.native修饰符。举个栗子非组件<input :placeholde- 阅读剩余部分 -

1、全局变量专用模块就是以一个特定模块来组织管理这些全局量，需要引用的地方导入该模块便好。全局变量专用模块 Global.vue<script> const QueryApplyInfo = {}; const AreaInfoList = {}; const OrderDictList = {}; const decodeOrderDict = {} const ProfessionInfoList = {}; const decodeProfessionInfo = {}; export default- 阅读剩余部分 -

组件核心代码代码，命名liang.js/* * @Liang liweiliang QQ:406320591(406320591@QQ.com). * @date 2018-08-08, * @version 1.0.0 * @liweiliang Inc. All Rights Reserved */ let Liang = {}; Liang.install = function(Vue,options){ Vue.prototype.$Validate = (_this) => { var _Vaild = _this.- 阅读剩余部分 -

使用vue单页开发项目时遇到一个很恶心的问题：在列表页点击一条数据进入详情页，按返回键返回列表页时页面刷新了，用户体验非常差啊！！！查阅了一下相关问题，使用解决这个问题，下面是我的使用心得。是Vue的内置组件，能在组件切换过程中将状态保留在内存中，防止重复渲染DOM。首先在App.vue页面上有下面一段代码，我们都知道这是页面渲染的地方<router-view></router-view> 把这段代码改成如下：<keep-alive> <router-view v-if="$route.meta.keepAlive- 阅读剩余部分 -

Event Loop，事件环，线程进程。这些概念对初识前端的同学来说可能会一头雾水。而且运行js代码的运行环境除了浏览器还有node。因此不同环境处理Event Loop又变得不同，十分容易混淆。如果你有这样的疑问。下文将给你一个清晰的解释。概念梳理首先我们简化一下概念，把进程，线程，事件环，这些概念梳理一下。清晰了概念后面用到的时候就会有共鸣。进程和线程基本概念拿出在教科书里的概念：1、调度：线程作为调度和分配的基本单位，进程作为拥有资源的基本单位；2、并发性：不仅进程之间可以并发执行，同一个进程的多个线程之间也可并发执行；3、拥有资源：进程是拥有资源的一个独立单位，线程- 阅读剩余部分 -

下载安装插件依赖npm install vue-wechat-title --save 在main.js中引入插件import VueWechatTitle from 'vue-wechat-title' Vue.use(VueWechatTitle) 在路由文件 index.js中给每个路由添加titleroutes: [{ path: '/', name: 'index', component: index, meta:{ title:'首页' // 标题设置在这里 } },{ path:'/deta- 阅读剩余部分 -

第一步 node环境安装1.1 如果本机没有安装node运行环境，请下载node 安装包进行安装1.2 如果本机已经安装node的运行换，请更新至最新的node 版本下载地址：https://nodejs.org/en/ 或者 http://nodejs.cn/第二步 node环境检测为了快乐的使用命令行，我们推荐使用 gitbas1.1 下载git 并安装下载地址 https://git-for-windows.github.io/安装成功后 右键菜单我们可以看到 Gti Bash Here 。说明我们已经安装成功git1.2 检测node 是否安装成功右键空白，选择 G- 阅读剩余部分 -

如果需要将某个元素 在可以滚动元素（scroll）中设置为居中计算方法为： 需要的scrollleft + 普通居中时候的offsetLeft = 当前的scrollleft+当前元素的offsetLeft = 固定的当前元素在整个滚动条中距离左边的位置DEMO<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <script s- 阅读剩余部分 -

随着自己写过的页面的增多，也遇到了很多CSS兼容性的问题。这些兼容性问题，都是必然的，因为技术在不断进步，不断革新，所谓，“后浪推前浪，前浪拍死在沙滩上”，当然我们的技术不能是被拍死在沙滩上，我们还要支持，不支持的话，只能是你这个页面，这个产品被淘汰。那么为了不被淘汰，我们就要做些兼容性处理。 我写页面的时候用到过很多的flex布局，觉得非常好用。下面附上一篇不错的flex布局介绍的文章。 Flex 布局教程想了解的可以自己去看看这篇博文，或者自己百度，这里先部多做介绍，我们主要来说一说flex布局的兼容性问题。why?大家可能想问了，flex布局为什么会存在兼容性问题啊？- 阅读剩余部分 -

1、移动端web页面显示图片在ios下回出现图片透明非常浅的问题，使用如下代码解决：Element{ opacity: 1; } 2、iphone及ipad下输入框默认内阴影Element{ -webkit-appearance: none; } 3、html5调用安卓或者ios的拨号功能html5提供了自动调用拨号的标签，只要在a标签的href中添加tel:就可以了。<a href="tel:4008106999,1034">400-810-6999 转 1034</a> html5GPS定位功能具体请看：http:/- 阅读剩余部分 -

<input type="text" placeholder="请选择" readonly="readonly" unselectable="on"> 设置只读标签readonly="readonly",禁止光标显示unselectable="on" 但是这个Android机正常，ios,iphone 5(se)都还依然会出现光标所以在网上找了些资料，现在整理下，方案一<input type="text" value="test" onf- 阅读剩余部分 -

最近项目中用到了各种加密，其中就包括从没有接触过得aes加密，因此从网上各种查，官方的一种说法：高级加密标准（英语：Advanced Encryption Standard，缩写：AES），在密码学中又称Rijndael加密法，是美国联邦政府采用的一种区块加密标准。这个标准用来替代原先的DES，已经被多方分析且广为全世界所使用。经过五年的甄选流程，高级加密标准由美国国家标准与技术研究院（NIST）于2001年11月26日发布于FIPS PUB 197，并在2002年5月26日成为有效的标准。2006年，高级加密标准已然成为对称密钥加密中最流行的算法之一。很显然，没啥卵用。最- 阅读剩余部分 -

在react中可以定义默认props，使用es5时，可以使用getDefaultProps：var MyDemo = React.createClass({ getDefaultProps: function() { return { name: 'demo' }; }, render: function() { return <h1>This is my {this.props.name}</h1>; } }); ReactDOM.render( <MyDemo />, do- 阅读剩余部分 -

@media screen and (width: 768px) and (orientation: portrait) { body{ width:320px; -moz-transform: scale(2.4); -webkit-transform: scale(2.4); -o-transform: scale(2.4); -ms-transform: scale(2.4); transform: scale(2.4); transform-or- 阅读剩余部分 -
  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7