svg Props and CSS:如何在文本行的末尾有条件地显示VueJS？

文章/答案/技术大牛

发布

1回答

css、vue.js、svg、sass、vuejs2

我正在尝试通过props和一个三元运算符处理svg的添加，但与我使用过的其他样式不同，我不知道如何让它正常工作。事实证明，让svg直接显示在字符串的末尾和正确的大小是很有挑战性的。目前，svg从上面使用的svg中获取填充和边距；这很可能是由于使用了img标记。最后，这可能是一个简单的CSS问题，但我不禁觉得我实现prop<e

浏览 17提问于2021-02-08得票数 0

回答已采纳

1回答

反应测试库，组件单元测试

javascript、reactjs、unit-testing、testing、react-testing-library

我试图构建一个测试单元为我的简单的反应应用程序使用反应测试库。我阅读了所有的文档，然后被卡在里面。有件事我试过了，但不像我提到的那样起作用。"); // it is correct way to add a svg element as a button ?我认为这个问题是有条件地呈现的另一个组成部分。如

浏览 1提问于2020-04-13得票数 1

5回答

如何在v图标组件中包含字体图标？

vue.js、font-awesome、vuetify.js

/registerServiceWorker' import { faCode作为参考，我正在使用这里概述的内容：这和我上面的规定是一样的，但很遗憾我的图标没有显示.Update：我特别想要一个解决方案，它不包括添加相当重的字体Aweseall.css文件(<link href="

浏览 0提问于2018-08-26得票数 19

回答已采纳

1回答

Vue-test-utils加载依赖项- Vue3

vue.js、testing、vuejs3、vue-test-utils

我正在为VueJs中的单个文件组件开发一些测试。这些组件使用字体-令人敬畏的。import "bootstrap/dist/css/bootstrap.min.css";import { FontAwesomeIcon{ library }

浏览 1提问于2021-04-27得票数 3

回答已采纳

2回答

我是否必须*扁平化React.JS中的所有层次化组件声明？

reactjs、react-native

我想知道在React中创建动态选择组件的规范方法是什么。我是否必须按照下面的代码创建一个返回选项的独立组件，以便能够通过支持为每个条目定制值，然后将它们包含到单独的select组件中？我还将此技术(成功地)用于svg元素，因此上述问题也适用于： render = () => { <circle cx={this.props.scx} cy={this

浏览 3提问于2017-08-15得票数 6

回答已采纳

3回答

仅在Vuetify数据表中显示悬停的

javascript、vue.js、vuejs2、vue-component、vuetify.js

我有一个Vuetify数据表，分别带有标题和数据字段，在props.item.name中我添加了一个v图标，但我只想在将鼠标悬停在相应字段上时显示该图标。默认情况下，它不应该显示。}, }}) <link href="https://cdn.jsdelivr.net/npm/vuetify@1.5.18/dist/vuetify.min.css"> <td>{{

浏览 37提问于2019-09-14得票数 2

回答已采纳

2回答

假设该网站有6页的主页、商店页面和联系人页面，关于页面、订单页面、结帐页面，如果我们单击产品，它将显示产品详细信息页面。在主页中有3种不同的滑块，它需要所有的产品在滑块中显示，这意味着我需要在主页中使用API中的所有产品。此外，在商店页面上，我需要在商店页面上显示所有的产品我有一个名为Layout的组件，在这个组件中，我有条件地呈现页面，如for / have将被加载，/shop商店页面将被加载

浏览 3提问于2020-10-19得票数 0

回答已采纳

2回答

React.js下拉组件不隐藏按钮单击

reactjs

在制作可点击的Dropdown组件时，我遇到了一个问题。我的任务是在单击按钮时显示菜单，当用户单击文档中的任何位置或单击同一按钮时隐藏菜单，所有组件都应该是功能组件。我使用名为classnames的第三方包，它帮助有条件地加入CSS类，也使用React ContextAPI将道具传递给Dropdown子组件。DropdownMenu -(呈现带有菜单项的

浏览 6提问于2019-10-14得票数 1

3回答

用wkhtmltopdf /table/ acrobat-reader显示错误

pdf-generation、acrobat、wkhtmltopdf、foxit

html页面使用1像素边框的表。如果我用Acrobat或Foxit打开PDF，他们会随机错过绘制垂直边框，但如果我放大，它们就会出现。所以我猜这是某种舍入误差，因为线条太细了？分隔字符"a“和"b”的边框将根据缩放因子消失。我生成了这样的文件： <html><body> <span style="border: 1px solid black; background-color:red;">a</span

浏览 2提问于2011-11-29得票数 4

1回答

在与Firebase的React中呈现时执行的onSubmit方法

javascript、reactjs、firebase

我创建了一个组件，它呈现一个内部有按钮的div，然后它有条件地呈现一个来自open状态的FormValidation (一个用于在react中进行简单表单验证的模块)。到目前为止，一切都很好，但是出于某些原因，每当我单击按钮以显示onSubmit运行的formvalition时。/resources/icons/add.svg'; import PlusIconBlack from '../.

浏览 11提问于2019-06-14得票数 0

3回答

SVG文本消失在更大的标签上。

css、graph、svg、charts、morris.js

Morris.js使用SVG绘制图形。我在这里设置了一个JSbin： Morris.js使用Raphael绘制svg图。问题在于X轴上的标签.当标签的尺寸太大时，它们就会消失。我修改了保存标签图形和字体大小的div元素的大小，但是由于标签是为不同的用户动态生成的，所以我无法确定一个固定的值。一个理想的解决方案是将文本包装起来。我们可以做些什么来对付这种情况？Morris.js使用以下代码片段来生成text s

浏览 5提问于2013-10-24得票数 4

回答已采纳

1回答

setter方法是否在React中触发DOM重选器？

reactjs、react-hooks、getter-setter、use-state、use-context

我正在学习如何在一分钟内做出反应，做一个基本的日历应用程序，它很大程度上依赖于使用Date()对象。我试图显示选定的月份，这是通过点击两个字体可怕的箭头图标改变。只需要做一些控制台日志就可以看出，该日期正在成功地更新状态，但显示在< p>标记中的日期没有被重命名。这是任何人都有经验的吗？ // Ass

浏览 1提问于2020-09-27得票数 1

回答已采纳

5回答

如何使用jQuery在Chrome中拖动SVG元素而不产生偏移量？(Firefox还可以)

jquery、svg、jquery-svg

我正在尝试编写一些代码，允许SVG元素被拖来拖去。我看不到我做错了什么，也没有在这方面发现任何已知的bug。我构造了一个小例子来说明这个问题： <head> <style type="text/css"> // Update transform m

浏览 0提问于2012-05-17得票数 3

回答已采纳

3回答

重定向至React中具有不同页面布局的页面

reactjs

我无法在成功登录后重定向到具有不同CSS布局的页面。例如，我有一个公司页面，其中包含典型的导航栏，如Home、About Us、Services和Login。但我一直看到公司页面导航栏，但url清楚地显示localhost:3000/dashboard。我哪里错了？

浏览 24提问于2020-05-19得票数 1

回答已采纳

6回答

在vue.js 2中，使用v-if和v-show哪个更好？

javascript、performance、components、vue.js、vuejs2

我在一个使用vue 2的项目中工作。我需要知道在哪种情况下性能更好:使用v-if还是v-show？我有一个很长的列表，每个项目的列表都有一个隐藏的表单，我需要显示和隐藏该表单才能单击包含每个项目列表的按钮。使用v-if切换v-show类或添加和删除表单，哪个更好？

浏览 0提问于2017-02-23得票数 34

2回答

我怎样才能改变反应牌中的明星数量呢？

reactjs

我想改变下面图片中黄色星星的数量。我使用了地图功能，但不知道如何在卡片上有所作为。是否有办法根据数组中的数字使用“if”语法来区别对待？/section5.css"; return ( &

浏览 3提问于2022-10-05得票数 -1

回答已采纳

5回答

反应中的切换类

javascript、reactjs

我在一个有菜单按钮的项目中使用react。<a ref="btn" href="#" className="btn-menu show-on-small"><i></i></a><Sidenav ref="menu"/>class Header extends React.Component { constructor(<

浏览 10提问于2016-04-04得票数 35

回答已采纳

6回答

是否向SVG中的溢出文本添加省略号？

css、d3.js、svg

我使用的是D3.js。我想找一个与这个CSS类等价的SVG，如果文本从它包含的div中流出，它会添加省略号： display: block; -o-text-overflow: ellipsis;} 这是我的<

浏览 2提问于2013-04-12得票数 35

回答已采纳

5回答

使用CSS，如何将"A“与"B”的底部/末尾“紧密”对齐，其中"B“具有未知的宽度和文本包装

html、css、layout、html-table、alignment

我有一个“可排序”表，当前排序列的标题显示了一个图标：排序图标将显示在文本的末尾(即，我们支持LTR/RTL)。我目前正在使用display:flex。但是，如果表的宽度缩小并且列标题文本开始包装，我会遇到不清楚哪一列被排序的模糊状态：相反，我想满足以下要求：按钮必须存在，

浏览 4提问于2019-11-26得票数 8

1回答

使用Vue3与asp.net剃须刀页面中的模块

vue.js、vuejs3、razor-pages

在我的雇主希望我们编写的噩梦般的剃须刀代码的末尾，我需要加载一个脚本块来在呈现的html之上运行Vue3。不幸的是，我需要做的不仅仅是他们用vue做的简单的事情。我已经创建了我想要使用的各种组件，并在main.js中的独立vueJs项目中加载它们。'/vue3/node_modules/vuepic/vue-da

浏览 7提问于2022-10-06得票数 0

点击加载更多