来自How to change button color after all fields are filled in vuejs?的引用 new Vue({
el: '#app',
data() {
return {
user: {
password: "",
confirmPassword: "",
},
};
},
computed: {
isDisabled: function(){
return !thi
浏览 24提问于2021-03-19得票数 0
回答已采纳
1回答
我正在尝试创建一个画布外菜单系统，它在左右两面都能工作。
我可以让菜单正确地显示，左边的菜单按照我想要的方式工作；但是右边的菜单没有正确关闭；它在执行CSS转换之前跳起来。提供演示：
提供JSFiddle：
守则如下：
CSS：
@import url(http://fonts.googleapis.com/css?family=Lato:400,700,900,400italic,700italic,900italic);
@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700,900
浏览 1提问于2014-07-29得票数 0
回答已采纳
1回答
从vue1迁移到vue2
、、、、
我正在尝试将这个示例下拉菜单从vue1迁移到vue2。
我已经将ready方法更改为mounted，删除了json过滤器，并在close中重写了for循环，因为它会在控制台中导致错误。
现在，当我运行这个的时候没有任何错误，但是下拉菜单仍然不能正常工作--当我在菜单之外点击时，它不会关闭。有没有人能帮我移植这个？
new Vue({
el: '#menu',
mounted: function()
{
var self = this
window.addEventListener('click', function(e){
浏览 1提问于2017-08-08得票数 0
1回答
我有一个按钮，点击时会有一个涟漪动画。 在Safari中，按钮的border-radius不包含在overflow: hidden中 ? 所以，我制作了一个代码片段来演示这个问题，并在这里发布，对于这个代码片段，它是有效的： new Vue({
el: "#app",
methods: {
ripple(e) {
let x = e.clientX - e.target.offsetLeft;
let y = e.clientY - e.target.offsetTop;
let ripple = d
浏览 33提问于2020-07-15得票数 0
回答已采纳
1回答
我试图复制材料设计的连锁反应，因为我目前正在开发的应用程序将消除类星体，所以我正在从头开始构建所有元素。
这个效应：
我在纯CSS和JS中看过一些视频，我试着把它转换成我的项目，但是我在某个地方陷入了困境。我有悬停效应和鼠标位置记录正确，但涟漪效应只是没有触发，我不知道为什么。
任何帮助都将不胜感激！干杯!
CButton.vue
<template>
<button
@click="onClick"
:class="[
'c-btn',
`c-btn--${kind}`,
浏览 3提问于2021-11-13得票数 1
1回答
嗨，我正试图在我的项目中添加黑暗模式，并在一个教程中添加im，但是它似乎是一个javascript教程安装的vue one，这部分代码不起作用，我想知道是否有人可以帮助我将它转换为vue 3。这是教程链接，如果有帮助的话。非常感谢
<button onClick={() > setDarkMode(!darkMode)}>
{darkMode ? (
<SunIcon size="4rem" />
) : (
<MoonIcon size="4rem" />
浏览 3提问于2022-04-07得票数 0
回答已采纳
Vue.js v2.2.1
JSFiddle：
.fade-enter-active, .fade-leave-active {
transition: opacity .5s;
}
.fade-enter, .fade-leave-to {
opacity: 0;
}
.fade-enter-to, .fade-leave {
opacity: 0.5;
}
“淡入-进入-到，.淡出-离开”应该在转换后设置状态，但不像预期的那样工作。
预期：从“不透明度0”到“不透明度0.5”的平稳过渡
实战:从“不透明度0”到“不透明度0.5”的平滑过渡，然后突然跳到“不透明度1”
浏览 1提问于2020-03-17得票数 0
我试图在输入框内对齐输入标签并向右浮动。
输入框是从b4扩展的。
下面是它现在的样子(箭头显示我想做什么)
这是布局(在vue中，但忽略不计)。只是展示我是如何安排我的元素的。
<label class="input-label" :for="index" v-if="showLabel">{{ label }}
<span v-if="icon" :class="icon"></span>
<input v-if="f
浏览 0提问于2018-12-29得票数 3
回答已采纳
1回答
我正在建立一个反应页面，以显示价格。因此，我创建了一个Card元素来将所有数据放入其中，然后重用它。
现在，它看起来是这样的：\
请不要注意红色的背景，我只是用它来方便地看到UI的位置。
我正在尝试获取以下内容：
为此，我创建了一个类PriceCard，如下所示：
import React from 'react';
import { Button } from 'react-bootstrap';
import TextContents from '../../assets/translations/TextContents'
浏览 0提问于2020-08-06得票数 0
我正在尝试将一个活动类应用到模板组件中的列表项中，当它被单击时，这应该是独占的，并且从所有其他列表项中删除该类。
我试着通过点击和引用传递一个新的数据对象，我甚至在正式文档中使用了这个例子，但没有用，我不知道为什么它不能工作。
Vue.component('delivery-options', {
props: ['deliveries'],
template: '<li><p><strong>{{ deliveries.price }}</strong>{{ deliverie
浏览 0提问于2017-12-04得票数 3
回答已采纳
需要使用math.div而不是斜杠重写此函数。下面给出的URL中提到的细节。
@function px2em($px, $metric: 'em', $base-font-size: 16px) {
@if unitless($px) {
@warn "Assuming #{$px} to be in pixels, attempting to convert it into pixels.";
@return px2em($px * 1px, $metric, $base-font-size);
浏览 4提问于2021-05-25得票数 15
回答已采纳
1回答
我有一个相对简单的模式(我已经简化了这个问题的内容)，它由一个覆盖，一个模式容器和模式本身组成。
它和预期一样工作，除了在需要滚动的较长页面上，它显示在页面底部。我已经多次修改CSS，但都无济于事
我怎么才能让这个模式在页面的顶部打开呢？
.modal-vue {
display: block;
}
.modal-vue .overlay {
text-align: center;
position: fixed;
z-index: 9998;
top: 0;
left: 0;
width: 100%;
height: 100%;
background
浏览 5提问于2021-11-11得票数 0
1回答
从像素转换为em
、、、
前几天，我从图斯普鲁斯那里看了一本关于防爆网页设计的很好的教程。教练有一个很棒的功能，是在斯泰勒斯做的。
$base_font_size = 16
$base_font_size_ems = unit($base_font_size / 16, em)
$px = unit(1 / $base_font_size, rem)
$px_em = unit(1 / $base_font_size, em)
要在Stylus中调用这个酷函数，只需键入：
.button
font-size: 16 * $px
border-radius: 3 * $px solid #000
如果我理解
浏览 0提问于2015-05-10得票数 3
回答已采纳
因此，这两个旋转的矩形形成一个V：
div {
position: relative;
left: 100px;
display: inline-block;
margin-left: 100px;
}
div::before {
content: '';
position: absolute;
transform: rotate(-45deg);
transform-origin: bottom right;
width: 20px;
height: 100px;
background: red;
}
div::after {
浏览 2提问于2022-06-07得票数 2
回答已采纳
我将Vue3与PrimeVue结合使用，并在中包含了许多项目。基于示例代码:当选择所有项目时，它将用三个点切断重叠的项目。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewpo
浏览 12提问于2021-11-04得票数 0
2回答
我正在使用作为wordpress。
他们有一个，我不知道它想做什么。
// Rem output with px fallback
@mixin font-size($sizeValue: 1) {
font-size: ($sizeValue * 16) * 1px;
font-size: $sizeValue * 1rem;
}
有人能解释一下背后的数学吗？
如果在px中给出字体大小，我如何利用它？
浏览 0提问于2016-02-02得票数 0
回答已采纳
我开发了一个顶部导航栏，这是固定在顶部，我试图添加右侧图标和一些内容到顶部导航栏[like this](https://i.stack.imgur.com/4xqyZ.png)的两个图标和下面的内容，如个人资料和购物车，必须在右侧顶部导航栏内，我试图解决这一点，但它没有发生，请帮助我解决这个问题。 📷 Dashboard.vue <template>
<div class="main">
<nav class="navbar navbar-default navbar-fixed-top">
&l
浏览 66提问于2021-07-03得票数 0
回答已采纳
首先，我知道，要将一个非单位值转化为一个单位，我可以将一个单位值乘以一个单位：
$value: 25 * 1px; // 25px
然而，我想知道是否有任何方法来做这个单位是动态的。
$unit: rem;
$value: 23;
.Box {
// Try interpolation
$united-value: #{$value}#{$unit};
value: $united-value; // Appears to be correct
// Check it is actually a number using unitless
check: unitless
浏览 4提问于2014-10-14得票数 4
回答已采纳
我有一个带有选项的select下拉列表。这个设计有一个自定义的选择箭头符号，所以我所做的是隐藏默认的选择箭头/三角形，并将我们的符号放在顶部(作为一个图像文件)。 <div class="select-wrapper">
<label>
<select>
<option :value="null">Filter</option>
<option value="0">Option 1</option
浏览 19提问于2021-04-14得票数 1
回答已采纳
2回答
由于某些原因，这是在Vue 3中起作用的，它说在其他方面都是不推荐的，所以请回答：
.description >>> p {
color: red;
margin-bottom: 1rem;
}
但我尝试了所有的排列：：v深，但似乎无法使它工作：
::v-deep .description {
p {
color: red;
margin-bottom: 1rem;
}
}
.description {
::v-deep p {
margin-bottom: 1rem;
}
}
我怎么用“香草”Vue 3来做这件事？
<
浏览 0提问于2021-07-28得票数 2
回答已采纳
2回答
当窗口大小减小时，行内容不会更改它的大小。
问题在于每个元素的样式- flex: 0 0 100px。
不可生长(0)，不收缩(0)，初始长度为100 an
如何替换此样式，使其看起来相同，但将响应窗口大小的减小。
如果没有flex: 0 0 100px，它就不会是直线顺序的，并且每个元素都不会位于下一个元素的行之上
使用array.map((obj, index) => {return ( <div，但我在这里只使用了两个元素。
-两行
如果在代码框中查看它会更好，请告诉我，我将删除下面的代码片段。
.product-row {
background-color: r
浏览 4提问于2021-09-02得票数 0
我正在测试provide and inject方法。我把datas，del-function放在父母提供的地方，我用v-for='data' in datas把动态渲染放进孩子里。
我想要实现的目标是:当我在子中按下“=>”del-function的“删除”按钮时，父级中的datas将得到删除项，而父级provide中的datas将被更新。
然后，子程序获得新的datas来进行可视化更新。v-for重渲染.!!！
但是当我按下“删除”按钮时，datas更新了，但是视觉上没有人被删除。
// parent vue file
<template>
<
浏览 11提问于2022-04-30得票数 1
我试着做一个简单的计算器，它几乎完成了，除了我不能固定它的屏幕高度。当我输入数据时，计算器屏幕的高度会发生变化。要重现这个问题，您可以尝试添加1+ 2。我一直在尝试添加最小高度和最大高度，但都没有效果。我可以用js来修正它的高度，但我想要一个纯CSS解决方案。以下是代码：
let screen = document.getElementById("screen");
let firstArg = document.querySelector(".firstArg");
let operator = document.querySelector(".o
浏览 3提问于2022-01-22得票数 0
回答已采纳
1回答
我试图用Laravel使用Vue-google-map包，但在使用最基本的文档设置时，我一直得到"Vue警告:未知的自定义元素：--您注册组件正确吗？“错误。
app.js
require('./bootstrap');
window.Vue = require('vue');
import * as VueGoogleMaps from 'vue2-google-maps'
Vue.use(VueGoogleMaps, {
load: {
key: 'MY_KEY',
librari
浏览 0提问于2018-10-09得票数 0
1回答
所以我想要一个带有颜色变量的框影。我在这里的一篇文章中看到，rgba(var(--card-border-color),0.75);工作得很好，但是在一个框影属性中使用它会破坏它。所以这个剂量不起作用：
box-shadow: 0px 0.46rem 2.18rem rgba(var(--card-shadow-color), 0.03),
0px 0.93rem 1.4rem rgba(var(--card-shadow-color), 0.03),
0px 0.25rem 0.53rem rgba(var(--card-shadow-color), 0.05),
0
浏览 0提问于2019-12-09得票数 1
回答已采纳
1回答
我想知道如何将整个现有单元 (em / rem)转换为像素
现在，我正在使用 UI为任何网站/模板(重叠)制作插件。
但他们正在使用像雷姆或雷姆这样的单位。
如何将整个输出单元转换为px easy (任何技巧)？
例如，我想在vue.config.js中添加一些配置/插件
module.exports = {
configureWebpack: {},
css: {},
chainWebpack: config => {}
}
浏览 2提问于2020-12-18得票数 0
1回答
我在做一个简单的TODO应用程序。在我的index.html中，我有一个带有id #app的根div。在这里，我有一个div与以前的类.todobox。在这个div中，我将列出我在main.js中保留的变体。每个变体都有一个名为varStyle的特殊属性，它应该相应地编辑每个.todobox。我这样做，因为我需要我完成的任务显示与灰色背景和取消-一个红色的。
问题：，不管我放什么类型的varStyle，它们都以与主.todobox相同的样式显示。奇怪的是，控制台没有显示出任何重大问题。
怎样才能解决这个问题呢？我将感谢任何帮助，谢谢提前！
var todo = new Vue({
浏览 2提问于2020-08-13得票数 0
回答已采纳
我正在开发一个应用程序，它是用创建的。
在创建项目时，我将使用Karma作为选项进行测试，因此它已经全部设置，并且没有更改任何配置。
该应用程序是一个Github用户查找程序，目前由三个组件组成：App.vue、Stats.vue和UserForm.vue。stats和form组件是包含app组件的子组件。
这是App.vue
<template>
<div id="app">
<user-form
v-model="inputValue"
@go="submit"
:
浏览 3提问于2016-12-18得票数 1
1回答
我正在开发一个网站，在其中我显示N数量的图像。我想如何显示它们的一个很好的例子就是是如何做的。图像以行的方式显示，填充当前视口的宽度，并且不会使任何图像变形。
我的尝试如下：
#CSS
.item {
display: inline-block;
vertical-align: top;
position: relative;
overflow: hidden;
padding: 0.5em;
background: lightcoral;
border: black solid 1px;
}
.item img{
m
浏览 19提问于2021-05-26得票数 0
回答已采纳
1回答
我从设计者那里获得了xd.adobe链接，将其实现为网页，所以我采用了与adobe相同的px大小，并将它们放到我的网页HTML元素中，但我注意到的是，HTML元素在更大的屏幕上看起来更缩放，所以如果屏幕与xd.adobe中的屏幕大小匹配，那么网页将是相同的，否则它会更大，我读到的解决方案之一是停止使用px并开始使用%，但不会适用，因为项目将在几天后完成。
浏览 14提问于2022-05-22得票数 0
我正在用Vue构建一个第三方web组件，它的大部分样式都严重依赖于Tailwindcss。
web组件的阴影dom封装了大部分样式和css，使得(大部分)样式不会从web组件所在的网页渗漏到阴影dom的内部，反之亦然。
然而，Tailwind使用基于rem的值来调整几乎所有的字体、填充、高度、宽度等。
我刚刚发现，一个明显的例外情况是，父页面的样式会渗入到卷影dom中，因为卷影dom会将主页样式表的html{ }部分中设置的基本字体大小继承到卷影dom中。
由于rem值来自父html{}块，这意味着如果主题页面在其页面的html {}块中设置了除16px以外的任何字体大小，那么我所有基于Tai
浏览 4提问于2021-04-06得票数 0
1回答
我有一个问题，火狐选择元素，当我缩小宽度，只有按钮图标，图标将消失时，放大。
在Firefox中打开并放大到90%的
Html
<select>
<option>--Select--</option>
<option>test1</option>
<option>test2</option>
<option>test3</option>
<option>test4</option>
<option>t
浏览 1提问于2016-11-17得票数 1
回答已采纳
2回答
我有两个媒体查询，它们具有完全相同的.css属性：
@media only screen and (max-width: 320px) {
h2 {
font-size: 3rem;
line-height: 3.5rem;
}
.slider h3 {
font-size: 2.5rem;
line-height: 2.5rem;
}
.col .wrapper {
padding: 3rem;
}
}
@media only screen and (max-width
浏览 6提问于2015-05-02得票数 0
回答已采纳
我正在Vue中创建一个模态，我想在用户单击内部模式容器外部时关闭它。问题是，当我在单击父元素时添加事件侦听器时，所有子元素在单击时也会触发该事件侦听器。
我在下面创建了一个简单的演示来演示我的问题。如果用户单击父元素的黑色部分，则模式应该关闭，但子元素的包含空白不应该触发关闭函数。
new Vue({
el: '#modal',
data: {
active: true,
},
methods: {
closeModal() {
this.active = false
}
}
})
.modal {
display
浏览 0提问于2018-03-26得票数 0
回答已采纳
2回答
最近我为了工作而学习vue.js，我面临着一个严重的问题。我想做一个简单的TODO应用程序。在我的index.html中，除了一个标头的div和带有id:#app的根div之外，什么都没有。
在根div中，我有另一个div (带有一个类.todobox)，其中我使用v-for放置了一个变体列表。当我在main.js文件中引用#app并放置一个变体数组时，控制台不会显示任何重大错误。我的变体还包含一个特定的描述(variant.varDesc)，我把它保存在todobox中的<p>元素中。
问题：--当我打开一个应用程序时，它只显示一个空白的.todobox和一个包含以下文本的<
浏览 1提问于2020-08-12得票数 1
回答已采纳
2回答
我试图添加一个平稳的过渡按钮在悬停和点击，但它不工作。试过transition: all .5s ease-in-out;，transition: top .5s ease-in-out;，但没有。我不知道为什么不管用。
.intro a {
color: white;
font-size: 2em;
text-align: center;
text-decoration: none;
background-color: #ffcc00;
display: block;
position: relative;
padding:
浏览 8提问于2022-07-27得票数 0
回答已采纳
我正在创建一个卡片，它使用网格来显示数据。我需要能够允许最多8列，但也允许网格填充可用的空间，如果有少于8列。
目前，我使用的是网格模板列:重复(8，自动)；它很好地用8列填充空间，但是如果我有6，例如，它会在右边留下一个空格。
*,
body,
html {
margin: 0;
box-sizing: border-box;
}
.card {
width: 100%;
height: 150px;
min-height: 100px;
background-color: #333333;
border-radius: 15px;
padding: 1
浏览 3提问于2020-01-24得票数 0
回答已采纳
如何将映射合并为sass中的现有映射？
我目前正在使用_config分部中的sass映射来定义我的断点，例如：
$breakpoints: (
small: 35rem,
medium: 55rem,
large: 75rem,
xlarge: 90rem,
element-breakpoint-1: 100rem,
element-breakpoint-2: 110rem
);
@mixin breakpoint($width) {
@media screen and (min-width: map-get($breakpoints
浏览 3提问于2014-12-11得票数 3
回答已采纳
2回答
我想在我的Vue Vite项目中全局创建和使用手写笔变量。如何从全局导入手写笔变量，以便在我的证监会的脚本部分中使用？
下面是我的Vite配置：
export default defineConfig({
plugins: [vue()],
resolve: {
alias: {
'@': path.resolve(__dirname, './src'),
},
},
css: {
preprocessorOptions: {
styl: {
additionalData: `@im
浏览 19提问于2022-08-03得票数 2
4回答
我试图将侧边栏隐藏到一个负数(-205 an )，这样我就可以在内容包装器和侧边栏同时移动的情况下获得效果。
问题是边栏仍然显示在右边？我想我可以隐藏它发送到“外部”的网页。我不能简单地在侧边栏上使用显示块none和块，因为它不会使动画变得流畅。
var rightSidebarOpen = false;
$('#toggle-right-sidebar').click(function () {
if(rightSidebarOpen) {
$('#sidebar-right').css('righ
浏览 0提问于2018-05-02得票数 0
回答已采纳
尝试使用这个转换器，但问题是我有一个Borland 5数据库，它有745个文件和176个DBS，并且我超过了运行这个java的查询长度限制。
我试着用一个批处理文件；
java -jar "%~dp0\client-0.0.5.jar" convert --output-format=mysql "%~dp0ABALANS.DB" "%~dp0ABALANS.PX" "%~dp0ABALANS.YG0" "%~dp0ABALANS.XG0" ... Output/
但都超过了查询限制。
所以我的问题是：
有方法可以
浏览 6提问于2022-03-24得票数 1
回答已采纳
我正在为一项潜在的工作做编码测试，并想让计算正确，并想知道是否有人知道一个在线工具，我可以用它来根据框架体和html大小来转换概要中所要求的像素大小。
默认值im使用：
html {
font-size: 62.5%
}
body {
font-size: 1.5em;
line-height: 1.6;
font-weight: 400;
font-family: HelveticaNeue, "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #222
}
我认为使用e
浏览 2提问于2017-03-16得票数 0
我用CSS转换将鼠标从右到左的容器动画化。这在除之外的所有浏览器中都能正常工作。原因是我在CSS left属性中使用(并且需要使用) calc()。
我在这里创建了一个现场演示：
CSS如下所示：
div {
background: red;
width: 100px;
height: 100px;
position: absolute;
top: 100px;
left: 90%;
-webkit-transition: left 0.7s cubic-bezier(0.77, 0, 0.175, 1);
-moz-trans
浏览 3提问于2014-01-15得票数 49
回答已采纳
我有一个使用v-model绑定到amount数据属性的range输入元素。我有另一个<p></p>元素，它显示从计算属性返回的格式化金额，但问题是，数字没有格式化。 我期望看到的 12,000 我所看到的 12000 这是一个演示 new Vue({
el: "#app",
data: {
amount: 0
},
computed: {
formattedAmount(){
return this.amount.toLocaleString()
}
}
}) body {
background: #202
浏览 185提问于2020-04-24得票数 1
回答已采纳
我在我的项目中使用了Bootstrap 4。我也开始使用rem作为长度单位。我设置了rem = 10px，只是为了便于将px转换为rem，我相信这是标准做法。但这样做会使所有Bootstrap默认值都不可用(即太小)。这是因为Bootstrap已经开始使用rem代替px。因此，如果我设置了rem = 10px，我最终会手动设置每个元素的样式，甚至是按钮，因为所有元素都变得太小了。
举个例子：
对于.lead，font-size为1.25rem = 12.5px。文本太小了。
我只是想知道，在他们的项目中使用Bootstrap的开发人员，他们是否使用rem或px作为长度单位。如果是rem，是10
浏览 0提问于2018-06-26得票数 0
1回答
我有以下3个项目的网格：
<div class="grid">
<p> </p>
<p> </p>
<button> </button>
</div>
.grid {
display: grid;
justify-content: flex-start;
align-items: flex-end;
grid-template-columns: minmax(200px, 1fr) minmax
浏览 1提问于2018-10-04得票数 0
在我了解rem/em单元之前，我使用px对我的整个网站进行了编码，所以它的响应能力不强。
有没有办法将px转换为rem/em单位，以便更快、更容易地更改我的网站？
浏览 4提问于2022-11-20得票数 0
7回答
什么是Scss的emCalc()在less中的等价物？
padding: emCalc(24px);
在Scss中将根据视点和缩放级别计算em。less中有没有内置的函数？
浏览 1提问于2013-10-22得票数 2
1回答
无论我看起来尝试了什么，我都不能在屏幕中央的导航栏中对齐一些内容(噢，我知道的讽刺！)
# app.vue
<template>
<header>
<ContactBar />
</header>
</template>
# ContactBar.vue
<template>
<nav class="bg-neutral-900 w-100">
<div class="mx-auto p-4 max-w-7xl text-zinc-300">
浏览 5提问于2022-06-25得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
腾讯会议
实时音视频活动推荐
腾讯云开发者
