小编Fro*_*yee的帖子

如何更改 Strapi 中的 id

目前我第一次在 Strapi 上工作,但想根据 id 连接集合类型,但是当我删除一个例如 [id 4] 并添加新的集合类型时。它将创建一个 [id 5]。所以我认为这是我犯的一个错误,并再次将其删除,现在它以条目 [id 6] 结束。我如何修改它,以便它根据现有的最高 [id 3] 重新创建一个新的 [id 4]。检查图像以更好地理解我的意思。。

strapi

7
推荐指数
1
解决办法
4251
查看次数

如何在 React 中加载和播放 Youtube 视频

目前我正在尝试构建一个应包含 YouTube 链接的应用程序"https:\/\/www.youtube.com\/watch?v=IEDEtZ4UVtI"。因此,第一次尝试运行它是 O <video className="video" src="https:\/\/www.youtube.com\/watch?v=IEDEtZ4UVtI"></video>,但正如您可能会看到的那样,它不会按预期工作。还有什么其他选择。请记住,我的 API 中没有任何嵌入链接,因此您看到的第一个 YouTube 链接只是我应该使用的一个。

youtube iframe reactjs

6
推荐指数
2
解决办法
2万
查看次数

如何使用 React 测试库测试 HTML 内容

目前我正在编写一个测试来测试里面的内容(HTML 内容),但似乎我无法使用 React 测试库正确测试。它可以找到它的 id 值,但是如何获取该元素中的 HTML 内容。

import React from 'react';

export const TopBar = () => {
    return (
        <div className="dashboard-title-component">
            <div>
                <div data-testid="title-content">Dashboard Menu</div>
            </div>
        </div>
    )
}

import React from "react";
import { render } from "@testing-library/react";
import { TopBar } from "./TopBar";
import { Provider } from "react-redux";
import { store } from "../../Store";
import { screen } from "@testing-library/dom";
import "@testing-library/jest-dom/extend-expect";

test("It should check if content matches", () => {
    render(
        <Provider store={store}>
            <TopBar/> …
Run Code Online (Sandbox Code Playgroud)

html javascript reactjs react-testing-library

5
推荐指数
1
解决办法
7389
查看次数

如何绘制树结构的线条

我使用 css grid 来输出图像中显示的元素的确切结构。唯一缺少的是您在下图中看到的线条。最重要的是代码简洁、干净和 DRY。我在考虑使用伪元素,只是它不会帮助编写可读的代码。

请不要使用SASS

.three {
  display: grid;
  grid-template-rows: repeat(7, 100px);
  grid-template-columns: repeat(3, 1fr);
  grid-gap: 1em;
  
  grid-template-areas:
  
     ".  C  ."
     ".  .  B-1"     
     "A  B  B-2"     
     ".  .  B-3"
     ".  D  ."
     ".  E  .";
}

.A   { grid-area: A; }
.B   { grid-area: B; }
.C   { grid-area: C; }
.D   { grid-area: D; }
.E   { grid-area: E; }
.B-1 { grid-area: B-1; }
.B-2 { grid-area: B-2; }
.B-3 { grid-area: B-3; }

.unordered-list {
  background-color: …
Run Code Online (Sandbox Code Playgroud)

css css-grid

5
推荐指数
1
解决办法
121
查看次数

TypeScript 属性“值”在类型“HTMLElement”上不存在。反应玩笑测试

目前,在没有 TypeScript 的情况下,此代码可以正常工作,但不幸的是,现在它无法正常工作。它给了我以下错误:“HTMLElement”类型上不存在属性“值”。不知道这有什么问题。似乎它在喋喋不休地谈论价值。在本例中,我使用 Jest 测试和 React。不确定我是否可以忽略此错误或应该修复此错误以避免将来出现奇怪的错误。

import React from 'react';
import axios from 'axios';
import { useDispatch } from "react-redux";
import { getData } from '../../../actions/index';;

export const SearchInput : React.FC = () => {
    const dispatch = useDispatch();
    let input: any;

    const getInputValue = (value: string):void => {
        let url = `https://api.tvmaze.com/search/shows?q=${value}`
    }

    return (
        <div className="container">
            <h1>Keyword</h1>
            <form className="form display-inline-flex" 
                onSubmit={e => {
                e.preventDefault()
                if(!input.value.trim()) return;

                getInputValue(input.value);
            }}>

                <input className="form-input-field disable-outline display-inline"
                    ref={node => (input = …
Run Code Online (Sandbox Code Playgroud)

testing typescript reactjs jestjs

3
推荐指数
1
解决办法
2952
查看次数