- 需求 在Vue项目开发过程中，需要根据按钮数量动态设置icon元素宽度。 分析 在el-col标签内，若只展示1个icon元素的话，则设置宽度为100%; 若显示2个icon元素的话，则设置宽度为50%； 以此类推… 解决方法 <el-col v-for="(btn, index) in btnArr" :key="index" :style="{width:... 需求 在Vue项目开发过程中，需要根据按钮数量动态设置icon元素宽度。 分析 在el-col标签内，若只展示1个icon元素的话，则设置宽度为100%; 若显示2个icon元素的话，则设置宽度为50%； 以此类推… 解决方法 <el-col v-for="(btn, index) in btnArr" :key="index" :style="{width:...
- 前言 做前端也有一段时间了，对于实现各种需求来说已经是游刃有余了，代码的质量和可扩展性都能把控。目前最缺乏的就是所谓的用户体验。 用户体验说起来是一个比较模糊的概念，但是又是实实在在地决定着用户用起来爽不爽。最近写了很多中后台系统，很多人都认为这种中后台系统没什么技术含量（使用现成的UI框架写写表单，table做一做增删改查），我想说的是任何产品如果想做好，都必须重... 前言 做前端也有一段时间了，对于实现各种需求来说已经是游刃有余了，代码的质量和可扩展性都能把控。目前最缺乏的就是所谓的用户体验。 用户体验说起来是一个比较模糊的概念，但是又是实实在在地决定着用户用起来爽不爽。最近写了很多中后台系统，很多人都认为这种中后台系统没什么技术含量（使用现成的UI框架写写表单，table做一做增删改查），我想说的是任何产品如果想做好，都必须重...
- highlight.js 支持几十种编程语言（点击下载），既包括常见的 C、java、javascript、ruby、python、html、css、sql等，还支持 apache、nginx 这些配置文件的语法。 除了引入Vue-highlight.js文件外，还需要引入样式文件highlight.js。vue-highlight.js只是实现了代码高亮的功能，安装... highlight.js 支持几十种编程语言（点击下载），既包括常见的 C、java、javascript、ruby、python、html、css、sql等，还支持 apache、nginx 这些配置文件的语法。 除了引入Vue-highlight.js文件外，还需要引入样式文件highlight.js。vue-highlight.js只是实现了代码高亮的功能，安装...
- 在项目开发过程中，需要将element-ui中的官方样式进行略微变动，但是在找到原来的代码进行更改之后发现样式并未生效，甚至代码都未进行自动编译，这就很奇怪了，从网上搜索发现原来是自己修改的源码是element-ui编译前的，如果自己需要进行样式修改的话，就需要重新编译一遍。具体做法是： 重新下载element源码；改掉你想要改的效果，执行命令 npm run bui... 在项目开发过程中，需要将element-ui中的官方样式进行略微变动，但是在找到原来的代码进行更改之后发现样式并未生效，甚至代码都未进行自动编译，这就很奇怪了，从网上搜索发现原来是自己修改的源码是element-ui编译前的，如果自己需要进行样式修改的话，就需要重新编译一遍。具体做法是： 重新下载element源码；改掉你想要改的效果，执行命令 npm run bui...
- WebStorm应用一段时间后，忽然提示授权一到期，汗……，尝试重新激活。 由于未知原因，目前激活码方式已不可行。接下来尝试使用jetbrains-agent.jar方式激活。 1.下载 jetbrains-agent.jar 包； 资源链接 提取码: ei9w 2.解压后放到安全目录（不易误删），然后去打开IDE，下面以 WebStorm 为例 3.打开IDE，点击... WebStorm应用一段时间后，忽然提示授权一到期，汗……，尝试重新激活。 由于未知原因，目前激活码方式已不可行。接下来尝试使用jetbrains-agent.jar方式激活。 1.下载 jetbrains-agent.jar 包； 资源链接 提取码: ei9w 2.解压后放到安全目录（不易误删），然后去打开IDE，下面以 WebStorm 为例 3.打开IDE，点击...
- 我们都知道for循环里要跳出整个循环是使用break，但在数组中用forEach循环如要退出整个循环呢？使用break会报错，使用return也不能跳出循环。 使用break将会报错： var arr = [1,2,3,4,5]; var num = 3; arr.forEach(function(v){ if(v == num) { break; } consol... 我们都知道for循环里要跳出整个循环是使用break，但在数组中用forEach循环如要退出整个循环呢？使用break会报错，使用return也不能跳出循环。 使用break将会报错： var arr = [1,2,3,4,5]; var num = 3; arr.forEach(function(v){ if(v == num) { break; } consol...
- 项目开发过程中，通过iframe引入其他页面，返回至前一页面时调用parent.location.reload(true)时Chrome、IE10(11)下均可以正常返回，但是在IE9下却无效。 改成top.location.reload(true)就可以了。 window.location.reload(true)刷新当前页面.parent.location.re... 项目开发过程中，通过iframe引入其他页面，返回至前一页面时调用parent.location.reload(true)时Chrome、IE10(11)下均可以正常返回，但是在IE9下却无效。 改成top.location.reload(true)就可以了。 window.location.reload(true)刷新当前页面.parent.location.re...
- 一、初步理解 1. npm安装package.json时 直接转到当前项目目录下用命令npm install 或npm install --save-dev安装即可，自动将package.json中的模块安装到node-modules文件夹下 2. package.json 中添加中文注释会编译出错 3. 每个项目的根目录... 一、初步理解 1. npm安装package.json时 直接转到当前项目目录下用命令npm install 或npm install --save-dev安装即可，自动将package.json中的模块安装到node-modules文件夹下 2. package.json 中添加中文注释会编译出错 3. 每个项目的根目录...
- 由于数据更改导致的虚拟 DOM 重新渲染和打补丁，在这之后会调用该钩子。 无论是组件本身的数据变更，还是从父组件接收到的 props 或者从vuex里面拿到的数据有变更，都会触发虚拟 DOM 重新渲染和打补丁，并在之后调用 updated。 有个值得注意的地方，举例说明： 例子 <template> <div> <div v-for... 由于数据更改导致的虚拟 DOM 重新渲染和打补丁，在这之后会调用该钩子。 无论是组件本身的数据变更，还是从父组件接收到的 props 或者从vuex里面拿到的数据有变更，都会触发虚拟 DOM 重新渲染和打补丁，并在之后调用 updated。 有个值得注意的地方，举例说明： 例子 <template> <div> <div v-for...
- 示例代码如下： <div id="app"> <input type="text" ref="input1"/> <button @click="add">添加</button> </div> <script> new Vue({ el: "#app", methods:{ add:functio... 示例代码如下： <div id="app"> <input type="text" ref="input1"/> <button @click="add">添加</button> </div> <script> new Vue({ el: "#app", methods:{ add:functio...
- 属性 window.onresize属性可以用来获取或设置当前窗口的resize事件的事件处理函数。 在窗口大小改变之后,就会触发resize事件. //vue页面 <template> <div id='echart'> 报表 </div> </template> <script> export default { data() { return ... 属性 window.onresize属性可以用来获取或设置当前窗口的resize事件的事件处理函数。 在窗口大小改变之后,就会触发resize事件. //vue页面 <template> <div id='echart'> 报表 </div> </template> <script> export default { data() { return ...
- 表单检验 注：prop对应的不单单是rules规则里面的验证项，同时对应着我们form-item下的v-model的值。prop绑定的类要与el-form-item下的v-model的值相对应。否则就算校验元素输入字符，也会提示“请输入”之类的提示语，造成校验不友好问题。 清除表单校验 // 清除表单校验的提示 if (this.$refs['XXX']) {... 表单检验 注：prop对应的不单单是rules规则里面的验证项，同时对应着我们form-item下的v-model的值。prop绑定的类要与el-form-item下的v-model的值相对应。否则就算校验元素输入字符，也会提示“请输入”之类的提示语，造成校验不友好问题。 清除表单校验 // 清除表单校验的提示 if (this.$refs['XXX']) {...
- 说明：vm.$refs 一个对象，持有已注册过 ref 的所有子组件（或HTML元素）使用：在 HTML元素 中，添加ref属性，然后在JS中通过vm.$refs.属性来获取注意：如果获取的是一个子组件，那么通过ref就能获取到子组件中的data和methods 一般来讲，获取DOM元素，需document.querySelector（".input1"）获取这个do... 说明：vm.$refs 一个对象，持有已注册过 ref 的所有子组件（或HTML元素）使用：在 HTML元素 中，添加ref属性，然后在JS中通过vm.$refs.属性来获取注意：如果获取的是一个子组件，那么通过ref就能获取到子组件中的data和methods 一般来讲，获取DOM元素，需document.querySelector（".input1"）获取这个do...
- Boolean(); 参数为 0、null 和无参数返回false，有参数返回true。 Boolean(""); //输出为：false Boolean(null); //输出为：false Boolean(0); //输出为：false Boolean("hi"); //输出为：true Boolean(100); //输出为：true Boolean... Boolean(); 参数为 0、null 和无参数返回false，有参数返回true。 Boolean(""); //输出为：false Boolean(null); //输出为：false Boolean(0); //输出为：false Boolean("hi"); //输出为：true Boolean(100); //输出为：true Boolean...
- 简介 mock是一个模拟数据生成器，旨在帮助前端独立于后端进行开发，帮助编写单元测试。其可模拟 Ajax 并返回模拟数据，使前端不用去调用后端的接口，方便测试。 官网： http://mockjs.com/0.1/#mock 应用 安装mock npm install mockjs 1 引用 在main.js中引用 // main.js require(... 简介 mock是一个模拟数据生成器，旨在帮助前端独立于后端进行开发，帮助编写单元测试。其可模拟 Ajax 并返回模拟数据，使前端不用去调用后端的接口，方便测试。 官网： http://mockjs.com/0.1/#mock 应用 安装mock npm install mockjs 1 引用 在main.js中引用 // main.js require(...
上滑加载中
推荐直播
0.25
-
基于开源鸿蒙+海思星闪开发板：嵌入式系统开发实战（Day1）2025/03/29 周六 09:00-18:00
华为开发者布道师
本次为期两天的课程将深入讲解OpenHarmony操作系统及其与星闪技术的结合应用，涵盖WS63E星闪开发板的详细介绍、“OpenHarmony+星闪”的创新实践、实验环境搭建以及编写首个“Hello World”程序等内容，旨在帮助学员全面掌握相关技术并进行实际操作
即将直播 -
华为云软件开发生产线（CodeArts）1月&2月新特性解读2025/03/18 周二 19:00-20:00
阿星 华为云高级产品经理
不知道产品的最新特性？没法和产品团队建立直接的沟通？本期直播产品经理将为您解读华为云软件开发生产线1月&2月发布的新特性，并在直播过程中为您答疑解惑。
去报名 -
基于能力图谱的openGauss项目闯关2025/03/20 周四 19:00-20:30
华为开发者布道师
想成为顶级数据库开发者吗？本次直播将从银行业务系统的数据库设计出发，带你逐步掌握openGauss的建库表、数据封装、密态技术、性能调优及AI应用。通过实战案例，全面展示openGauss的强大功能，助你提升技能，为未来的职业发展打下坚实基础。立即报名，开启你的数据库进阶之旅！
即将直播 -
基于开源鸿蒙+海思星闪开发板：嵌入式系统开发实战（Day1）
2025/03/29 周六 09:00-18:00
华为开发者布道师
本次为期两天的课程将深入讲解OpenHarmony操作系统及其与星闪技术的结合应用，涵盖WS63E星闪开发板的详细介绍、“OpenHarmony+星闪”的创新实践、实验环境搭建以及编写首个“Hello World”程序等内容，旨在帮助学员全面掌握相关技术并进行实际操作
即将直播 -
华为云软件开发生产线（CodeArts）1月&2月新特性解读
2025/03/18 周二 19:00-20:00
阿星 华为云高级产品经理
不知道产品的最新特性？没法和产品团队建立直接的沟通？本期直播产品经理将为您解读华为云软件开发生产线1月&2月发布的新特性，并在直播过程中为您答疑解惑。
去报名
热门标签
