我们一般使用样式的时候，有三种方法。外联样式：建立一个外部的CSS样式表，通过link标签进行引入。内联样式：在html中的标签style中编写。行内样式：在标签的style属性中编写。我们都知道，这样编写的样式是无法运用在表达式上和对象上的。在Vue中，我们可以将样式名作为变量使用，也就是可以将它应用到表达式和对象中。1 外/内部样式1.1 作为数组进行引用
转载
2024-07-01 06:11:37
38阅读
一、是什么Tree shaking 是一种通过清除多余代码方式来优化项目打包体积的技术，专业术语叫 Dead code elimination简单来讲，就是在保持代码运行结果不变的前提下，去除无用的代码如果把代码打包比作制作蛋糕，传统的方式是把鸡蛋（带壳）全部丢进去搅拌，然后放入烤箱，最后把（没有用的）蛋壳全部挑选并剔除出去而treeshaking则是一开始就把有用的蛋白蛋黄（
如果要我用一句话描述使用 Vue 的经历，我可能会说“它如此合乎常理”或者“它提供给我需要的工具，而且没有妨碍我的工作”。每当学习 Vue 的时候，我都很高兴，因为很有意义，而且很优雅。以上是我对 Vue 的介绍。在我第一次学习 Vue 的时候，我就想要这样的文章。如果你倾向于无党派的方法，请查阅 Vue 简单易懂的 用户指南. 我喜欢 Vue 的一点是它吸取了其它框架的优秀之处
一、简介在样式引入时，对于变量的引入，需要在每个文件里都要引入一遍，为了避免每次使用时都需要单独引入一遍的问题，采用了 style-resources-loader。在确保安装指定 CSS 解析器 插件（less、less-loader | stylus、stylus-loader …）后。这里以 less 举例，新建一个 reset.less (文件名随
本项目的笔记和资料的Download，请点击这一句话自行获取。day01-springboot（理论篇） ；day01-springboot（实践篇）day02-springcloud（理论篇一) ；day02-springcloud(理论篇二) ；day02-springcloud(理论篇三) ；day02-springcloud(理论篇四) 
一、问题叙述 项目里需要新添加一个表单页面，里面就只是几个select,这个几个select是原本封装好的组件，有自己原本的样式，而这次的原型图却没有和之前的样式统一起来，需要微调一下，这里就涉及到父组件修改子组件的样式。不想混用本地和全局样式，所以选择了>>>，但是并不起作用，就换成/deep/，其实到这里我也没有继续深入这个知识点，因为在浏览器里预览后已经实现了原型图的样式
vue3.0中，动态设置组件样式：在父组件中动态设置子组件（自定义组件）样式？1.通过props设置v-bind:style 来实现，不具体些了，这个很简单，但是如果是改变某个class里的某一个样式呢？并且这个class也是个动态绑定的，这种方法就不适用了。另外，props接受到的属性，无法直接传入vue里的style部分，vue3.0的语法是v-bind()直接用，只能是data里定义的，不能
转载
2021-03-09 19:49:05
2097阅读
2评论
最后const stateK = reactive({
editNameModel: []
})
//声明表单ref动态生成具体数量不知道，所以是数组
const editNameRef = ref([])
//getFormRef 在 Vue 中，使用 ref 创建的引用变量是响应式的。在组件渲染期间，如果你修改了 editNameRef，那么 Vue 会在下一个渲染周期中重新渲染组件并更
vue 组件中添加样式不生效的解决方法如何产生在开发项目中遇到在组件中添加样式不生效的情况。具体场景如下 vue 组件
//我用js在上面div标签中插入一个
text goes here
export default {
...
mounted(){
$('.box').html('
text goes here
')
},
...
}
//style ， vue组件scoped样式都会在
转载
2024-07-24 20:47:23
308阅读
Vue引入封装的方法和样式
原创
2021-07-19 16:28:43
932阅读
(文章目录)
一、需求
在Vue项目开发过程中，需要根据按钮数量动态设置icon元素宽度。
二、分析
在el-col标签内，若只展示1个icon元素的话，则设置宽度为100%;
若显示2个icon元素的话，则设置宽度为50%；
以此类推...
三、解决方法
<el-col v-for="(btn, index) in btnArr" :key="index&qu
原创
2023-09-01 14:53:20
140阅读
点赞
1评论
HTML :style 的用法
转载
2018-11-27 10:31:00
241阅读
2评论
(文章目录)
一、需求
在Vue项目开发过程中，需要根据按钮数量动态设置icon元素宽度。
二、分析
在el-col标签内，若只展示1个icon元素的话，则设置宽度为100%;
若显示2个icon元素的话，则设置宽度为50%；
以此类推...
三、解决方法
<el-col v-for="(btn, index) in btnArr" :key="index&qu
原创
2023-07-13 08:44:43
112阅读
点赞
1评论
(1). 深度作用选择器:希望scoped样式中的一个选择器能够作用得"更深",如影响子组件.覆盖element-ui中的样式时,只能通过深度作用选择器.(2). /deep/:.a {
/deep/ .b {
/* ... */
}
}
注:
①. less可以使用.
原创
2023-10-26 10:54:54
80阅读
例如：想给图片增加高度和宽度<el-image :class="classRotation" v-if="imageData.src !== undefined" :src="imageData.src" :style="imageStyle"></el-ima
原创
2024-06-04 23:22:11
313阅读
例如：想给图片增加高度和宽度<el-image :class="classRotation" v-if="imageData.src !== undefined" :src="imageData.src" :style="i
原创
2023-05-26 00:13:33
194阅读
Vue: scoped 样式与 CSS Module 对比前言Scoped 样式模块式 CSS总结 前言前两天在不同的城市感受了时间。今日早读文章由@西楼听雨翻译分享。正文从这开始～～在现代化的 Web 开发中，CSS 还远未完美，这一点应该没有什么意外。现今的项目通常都相当复杂，而 css 样式天生又是全局性的，所以到最后总是极容易地就发生样式冲突——要么是样式相互覆盖，要么就是隐式地级联到了
转载
2024-06-17 22:24:29
234阅读
在文档页面(http://localhost:8080/document)拉动滚动条，然后刷新浏览器会发现滚动条依然在原来的位置，这是浏览器的默认行为，会记录浏览器滚动条默认位置。但是点击浏览器“前进/后退”按钮，会发现当初那个页面的滚动条从0开始了，没有记录上一次滚动条的位置。现在要求点击浏览器“前进/后退”按钮，页面滚动条要记录上一次的位置，这时需要设置它的的滚动行为。这时候需要在路由配置中设
转载
2024-01-04 21:41:39
89阅读
目录一、关于vue应用于组件1、vue应用的数据配置选项2、定义组件二、组件中的数据与事件传递1、为组件添加外部属性2、处理组件事件 3、在组件上使用v-model指令三、自定义组件的插槽1、组件插槽的基本使用 2、多具名插槽的用法3、动态组件的简单应用4、范例：开发一款小巧的开关按钮组件一、关于vue应用于组件1、vue应用的数据配置选项vue应用中有许多方法和配置项供开发者
转载
2024-10-04 20:26:23
265阅读
CSS 预处理器是什么？一般来说，它们基于 CSS 扩展了一套属于自己的 DSL，来解决我们书写 CSS 时难以解决的问题：语法不够强大，比如无法嵌套书写导致模块化开发中需要书写很多重复的选择器；没有变量和合理的样式复用机制，使得逻辑上相关的属性值必须以字面量的形式重复输出，导致难以维护。所以这就决定了 CSS 预处理器的主要目标：提供 CSS 缺失的样式层复用机制、减少冗余代码，提高样式代码的可
