// html 模板 template <span class="red" :style="styleVar" @click="add">as</span> // js data() { return {
原创
2022-08-19 11:49:09
344阅读
Less安装注释导入变量（Variables）混合（Mixins）嵌套（Nesting）运算转义（Escaping）函数（Functions）命名空间和访问符映射作用域sass,less和stylussass变量的表示变量的赋值缩进的问题if条件判断的问题都支持嵌套 Less （Leaner Style Sheets 的缩写） 是一门向后兼容的 CSS 扩展语言。 安装将less安装为开发依赖
转载
2024-10-24 15:38:40
80阅读
Vue中的数据和标签内容是双向绑定的，也就是说当定义的方法（函数）里的值改变时，在视图标签里的显示内容就会自动更新！这种技术大大简化了我们的开发成本，缩减了复杂的逻辑设计。一、先来看看Vue中的数据1、数据的定义Vue中的数据是定义在Vue对象中的，用data：{ }声明数据变量：new Vue({
data:{
name:"kdy",
job:"软件工程师",
},
});上
转载
2024-06-05 13:38:57
295阅读
前言写此文章的目的主要是为了记录一下自己的学习过程便于日后用来查漏补缺 也希望能够帮助到一部分,如果在浏览的过程中您发现了错误希望您的及时帮忙改正，在此感谢！vue的基本语法本文是基于vue.js的方法来记录,首先做的是创建一个js文件夹，引入vue.js文件,点此下载(提取码:tfgn)一、vue实例<html lang="en">
<head>
<meta
# 使用 JavaScript 变量在 Vue 中动态设置 CSS
在前端开发中，尤其是在使用 Vue.js 时，能够通过 JavaScript 变量动态设置 CSS 样式是一个非常实用的技能。本文将指导你如何在 Vue 中实现这一功能。我们将会采取一个分步的流程，以帮助你掌握每一个细节。
## 整体流程
下面是一个基本的实现流程：
```mermaid
flowchart TD
1.Vue官网https://cn.vuejs.org2.引入通过script标签引入vue时最好放在head里，避免抖屏的情况。Tips：抖屏是指页面稍微大些，刷新页面会出现{{ }}的样式十分丑陋 3.实例元素通过id 和new Vue对象的 el 进行绑定，该id对应一个挂载点，Vue实例只会处理挂载点的内容；模板是指可以将挂载点的内容写入template标签中，同样会生效。{{
前言刚巧遇到有需要重构的项目，又要重新copy一份vue项目来。由于之前没有记录重构过程，故又要重新折腾一翻。于是想起汇总一篇博客，方便自己下次快速copy，也希望能帮助到圈子的朋友们。该教程适合0~2年工作经验的前端工作者们；该项目框架搭建过程，适合中小企业，门户，商城网站等。 构建 1)新建项目全局安装 全局安装webpack: npm install webpack webpack-cli
## 使用 Dockerfile 和变量构建 Vue 应用
在现代Web开发中，Vue.js 因其轻量和灵活性被广泛应用。而使用 Docker 来构建和部署 Vue 应用则能为开发者带来更多的便利，如环境一致性和自动化部署等。本文将介绍如何通过 Dockerfile 和变量构建 Vue 应用，并提供相应的代码示例。
### Dockerfile 的基础知识
Dockerfile 是一个文本文
一.vue应用的声明第一种声明如下：<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Hello</title>
<script src="js/vue.js" type="text/javascript" charset="utf-
最近vue用的越来越勤了，在复习一下vue如何使用less和scss，直接进入主题吧：安装使用less： 1、首先使用npm下载依赖； npm i less less-loader -S 2、修改webpack.base.config.js文件，配置loader加载依赖，让其支持外部的less,在原来的代码上添加 // 此种方法在控制台中标签样式显示的是style标签样式
{
test:
转载
2024-02-24 00:21:57
593阅读
.vue文件中style标签的几个标识符
在人生就要绝望的时候, 被编辑器所提示的一个
scopedSlots所拯救.
卧槽, 写到最后才发现这个属性的具体卵用. 详情见最后解决办法.
问题背景问题由来项目中使用了elementUI框架, 与.vue文件.现状: <template>中使用$style:[类名], <style module>进行了样式
转载
2024-10-15 07:28:25
182阅读
目录一、Vuex (全局变量管理~~多个页面共享数据)✿ 更详细的可以看官网：开始 | Vuex1、什么是Vuex？2、核心概念：(1) state：保存共享的状态（全局变量）(2) getters（类似计算属性）(3) mutations：(类似于事件注册) Vuex的store状态的更新唯一方式：提交Mutation 1）Mutation主要包括两部分：
今天遇到scoped内部的scss设置无效，解决办法如下：/deep/
.position-el-steps {
/deep/ .el-step.is-vertical {
.el-step__description {
margin-top: -20px;
}
.el-step__line {
border-left: 2px dashed #c0c4cc;
background-color:
VuePress 由两部分组成：一部分是支持用 Vue 开发主题的极简静态网站生成器，另一个部分是为书写技术文档而优化的默认主题。它的诞生初衷是为了支持 Vue 及其子项目的文档需求。每一个由 VuePress 生成的页面都带有预渲染好的 HTML，也因此具有非常好的加载性能和搜索引擎优化(SEO)。同时，一旦页面被加载，Vue 将接管这些静态内容，并将其转换成一个完整的单页应用(SPA)，其他的
Vue 定义全局使用的变量一、定义全局变量文件定义一个盛放全局变量的文件global.jsconst baseURL = 'http://kylebing.cn/starve';ex
原创
2022-06-30 11:08:39
495阅读
1、在css中使用变量 (1)css中声明变量 --color：red (2)使用变量 color:var(--
原创
2023-03-25 11:18:54
3754阅读
在Vue中使用全局变量是一个常见的需求，它可以让我们在整个应用程序中共享一些数据或配置信息。下面我将为你详细介绍如何在Vue中使用全局变量。
**步骤概述**
| 步骤 | 操作 |
| ---- | ---- |
| 1 | 创建一个Vue插件 |
| 2 | 在Vue实例中引入插件 |
| 3 | 在组件中使用全局变量 |
**具体操作**
**步骤1：创建一个Vue插件**
首先我
原创
2024-05-17 13:49:25
60阅读
姿势很重要，末尾有福利vue-antd-ui开源了一段时间后，收到了一些反馈，尤其是Form组件上线后，很多用户对JSX的使用感到迷惑和不习惯，为此专门介绍下Vue JSX的使用姿势及注意事项。Form组件的自动收集校验功能需要在JSX下使用，当然如果不需要自动收集校验，你依然可以使用templateVue 推荐在绝大多数情况下使用template来创建你的HTML。然而在一些场景中，你真的需要
Vue，现在前端的当红炸子鸡，随着热度指数上升，实在是有必要从源码的角度，对它功能的实现原理一窥究竟。个人觉得看源码主要是看两样东西，从宏观上来说是它的设计思想和实现原理；微观上来说就是编程技巧，也就是俗称的骚操作。我们这次的侧重点是它的实现原理。好吧，让我们推开它那神秘的大门，进入Vue的世界~vue是什么？vue究竟是什么？为什么就能实现这么多酷炫的功能，不知道大家有没有思考过这个问题。其实在
清晨的☀前言我们都知道在 Vue 中并不只有纯正的CSS,还有less、sass等，后面这些，写起来都可以级联着，不需要像原生的css那样，会方便很多。大家都知道我也是最近写的vue，看见周围人都在用这个，我也就去安装了一下，但是一直都报一个版本过高的错误。这种错误非常好解决，因为后端也常遇到，直接降版本就好了。因为好奇心的驱使，我就在想，为什么不能安装最新less-loader？好像也没有哪里体
