我想使用反应测试库获取 span 元素的值。
我想做什么?
我有一个如下所示的 span 元素,显示一些值
render = () => {
const count = 2;
return (
<span data-test-id="test-span">
{count}
</span>
)
}
Run Code Online (Sandbox Code Playgroud)
现在在我的测试中我访问如下元素,
const span_element = getByTestId('test-span');
Run Code Online (Sandbox Code Playgroud)
但我不知道如何检索它的价值。
我尝试使用 span_element.value 但说“HTMLElement 上不存在属性值”
我怎样才能解决这个问题。有人可以帮我解决这个问题吗?谢谢。
我想访问带有“icon”类的第一个元素。
DOM 看起来是这样的:
<div class="parent">
<div data-testid="add">
<div class="info"></div>
<div class="action">
<div class="icon"/> // <== I want to access this
</div>
</div>
</div>
<div class="parent">
<div data-testid="add">
<div class="info"></div>
<div class="action">
<div class="icon"/>
</div>
</div>
</div>
Run Code Online (Sandbox Code Playgroud)
如何获得第一个带有“icon”类的div?
我努力了:
const element = queryAllByTestId('add')[0].querySelector(
'div'
)[1];
Run Code Online (Sandbox Code Playgroud)
这使得元素未定义。
您好,我是编程新手,我想使用 javascript 访问对象内的数组...
我有如下的数据结构,
const some_obj = {
accessKey: "",
children: [
div.someclassname,
div.someclassname,
div.someclassname.highlight,
]
}
Run Code Online (Sandbox Code Playgroud)
下面是我记录变量时在浏览器控制台中的样子。
object
current: div.wrapper
accessKey: ""
align: ""
childElementCount: 4
childNodes: NodeList(4) [div.someclassname, div.someclassname.highlight,
div.someclassname]
children: HTMLCollection(4) [div.someclassname,
div.someclassname.highlight, div.someclassname]
Run Code Online (Sandbox Code Playgroud)
在控制台中打印 some_obj.children 会给出以下输出。object.children HTMLCollection(3) 0: div.someclassname 1: div.someclassname.highlight 2: div.someclassname
现在,我想从 some_obj 检查 some_obj 子数组中是否有 div.classname.highlight 。我该怎么做。
我尝试使用 some_obj.current.children.find() 但说 find 不是函数。
我如何检查 some_obj 子级是否具有 div.someclassname.highlight。有人可以帮我解决这个问题吗?谢谢
我想使用 ref 将事件侦听器添加到 div 元素。
我将 ref div_ref 添加到 Wrapper div 并在 enableDragEventListeners 方法中访问该 div_ref,以将事件侦听器添加到 componentmount 上。
下面是我的代码,
const SomeComponent: React.FC<any> = props => {
const div_ref = React.useRef(null);
React.useEffect(() => {
const enableDragEventListeners = () => {
const div = dropRef.current;
if (div) {
div.addEventListener('dragenter', handleDragIn); // get error here
div.addEventListener('dragleave', handleDragOut); //error here
div.addEventListener('dragover', handleDrag);//error here
div.addEventListener('drop', handleDrop);//error here
}
};
enableDragEventListeners();
}, []);
return (
<Wrapper ref={div_ref}>
{dragging && <Overlay>{props.children}</Overlay>}
</Wrapper>
);
}
Run Code Online (Sandbox Code Playgroud)
但我收到错误属性 addEventListener 在类型“从不”上不存在。有人可以帮我解决这个问题吗?谢谢。
编辑:完整的代码如下所示...我正在实现一个拖放组件,因此将其包装在想要使用它的组件周围,以便能够将文件拖放到其中。 …
我希望String.prototype.matchAll()
方法也能在边缘浏览器中工作。于是想到使用“string.prototype.matchall”npmjs包
我已经安装了这个包并main.js
像这样导入到我的文件中
import 'string.prototype.matchall';
Run Code Online (Sandbox Code Playgroud)
我必须在其他文件中使用这种方法,Input.js.
所以我使用如下
const matchAll = require('string.prototype.matchall');
Run Code Online (Sandbox Code Playgroud)
在我实际匹配字符串的方法中
replace = (original_string) => {
const regex_pattern = /\\d+@*)]/g;
const matchAll = require('string.prototype.matchall');
const matches = original_string.matchAll(regex_pattern);
return matches;
}
Run Code Online (Sandbox Code Playgroud)
但matchAll
变量未使用。我如何使用这个string.prototype.matchall polyfill。有人可以帮我解决这个问题吗?谢谢。
我想通过执行javascript
in来隐藏画布元素上的元素python
。
我已经尝试过以下:
def hide_elements():
driver = LiveLibrary.get_webdriver_instance()
js_script = '''\
element1 = document.getElementsByClassName('someclass');
element1[0].style.display = 'none';
element2 = document.getElementsByClassName('another');
element2[0].style.display = 'none';
element3 = document.getElementsByClassName('highlight');
element3[0].style.display = 'none';
element4 = document.getElementsByClassName('overlay');
element4[0].style.display = 'none';
'''
driver.execute_script(js_script)
Run Code Online (Sandbox Code Playgroud)
上面的代码有效,但正如您所看到的,有重复的代码。有没有办法可以简化这个过程,而不是找到每个元素并隐藏它们?
我想用一些 test-id 获取父元素中的 div 元素
我想做什么?
我有一个 test-id 为“parent-2”的父 div,其中有一个 div 元素,其中包含文本 Remove。
我想检索这个 Remove div 元素。还有多个 Remove div 元素。像下面这样的东西
<div data-test-id="parent-1">
<div>Remove</div>
</div>
<div data-test-id="parent-2">
<div>Remove</div>
</div>
<div data-test-id="parent-3">
<div>Remove</div>
</div>
Run Code Online (Sandbox Code Playgroud)
所以在上面的 html 代码中,我想点击 Remove div from div with parent test-id = "parent-2"
我试过像下面这样
utils.fireEvent.click(getByText('Remove'));
Run Code Online (Sandbox Code Playgroud)
这会引发错误,发现多个 Remove 实例。
我也试过这个 utils.fireEvent.click(getByTestId('parent-2').children[0];
这有效。但这会访问父级的第一个子级。但是想要更具体的查询。
那么我该如何解决这个问题,以便我可以点击删除 div 属于 test-id "parent-2" 的 div
谢谢。
我想从一个组件访问另一个组件的状态。为此,我只想将 contextprovider 包装到单击按钮时状态发生变化的组件,并从 usehook 返回状态,以便另一个组件可以访问该状态。
下面是在没有应用上下文的情况下组件的外观,
function UploadButton () { //this is where state is set
const [isDialogOpen, setIsDialogOpen] = React.useState(false);
const handleClick = () => {
setIsDialogOpen(!isDialogOpen);
}
return (
<>
<Button onClick={handleClick}/>
{isDialogOpen && <Upload/>}
</>
);
}
function UserButton() { //this is where state is accessed
return (
<Icon/> //this icon should be displayed only if !isDialogOpen
);
}
Run Code Online (Sandbox Code Playgroud)
上下文如下所示,我在 UploadButton 所在的同一文件中有 DialogContext。
interface DialogCtxState {
isDialogOpen: boolean;
setIsDialogOpen: React.Dispatch<React.SetStateAction<boolean>>;
}
const initialDialogState: DialogCtxState = {
isDialogOpen: …
Run Code Online (Sandbox Code Playgroud) 我是编程新手,我想实现一个下拉菜单,可以使用向上或向下箭头导航并输入键盘键。
我想做什么?我有一个下拉组件,列出了从父组件传递给它的项目。目前它通过鼠标单击选择下拉菜单中的项目。我希望它也可以与向上和向下箭头键和输入键一起使用。
我试图做什么?下面的代码片段适用于鼠标点击。
class Parent extends React.PureComponent {
state = {
input_val: '',
}
handle_item_select = (val) => {
this.setState({input_val: val});
}
handle_input_change = (e) => {
this.setState({input_val: e.target.value;
}
render = () => {
return (
<input
on_change={this.handle_input_change}/>
<DropDown
on_change={this.handle_item_select}
values={this.state.items}/>
)
}
}
class DropDown extends React.PureComponent {
handle_item_select = (value) => {
this.props.on_change(value);
};
render() {
return (
<div>
{this.props.values.map((value, index) =>
<Item
key={index}
value={value}
on_select={this.handle_item_select}
/>)}
</div>
);
}
}
class Item extends React.PureComponent {
handle_item_select …
Run Code Online (Sandbox Code Playgroud) 我想在 Windows 10 linux 子系统上安装较新版本的 terrafrom 0.12.24。我是使用这个界面的新手,我不知道该怎么做
我使用这些命令在 Windows 10 linux 子系统上安装了 terraform
wget https://releases.hashicorp.com/terraform/0.11.13/terraform_0.11.13_linux_amd64.zip -O
terraform.zip;
unzip terraform.zip;
sudo mv terraform /usr/local/bin;
rm terraform.zip;
Run Code Online (Sandbox Code Playgroud)
但是这安装了旧版本..当我运行一些脚本时,它给了我这个错误。
无法加载根配置模块:解析 terraform/local/terraform.tf 时出错:在 119:12:未知令牌:119:12 IDENT 文件
为了解决这个问题,我计划从 0.12.24 升级到较新版本的 terra。有人可以向我提供卸载和安装较新版本 terraform 的命令吗?