小编You*_*mar的帖子

我之前在 React 中像这样导入图像：

import person from '../images/image1.png'

然后像这样使用它们：

<img src={person} alt="" />

src现在由于某种原因我想指定路径本身，如下所示：

<img src="../images/image1.png" alt="" />

但它不起作用，即使它应该起作用。

我正在尝试构建一个与右侧对齐的粘性工具栏。但我无法让它与那一侧对齐：

如果我使用float: right;下面的元素，就会被拉起，如果我使用父容器，它会跨越整个屏幕宽度并使用，justify-content: end;并且使用z-index: 10;左右，该父元素的屏幕会被阻止。

那么如何才能最优雅地将元素对齐到右侧呢？

.container {
  background-color: cyan;
  height: 1000px;
}

.sticky-element {
  position: sticky;
  top: 20px;
}

.other-stuff {
  padding: 20px;
}

<div class="container">
  <div class="sticky-element">
    <button>Button 1</button>
    <button>Button 2</button>
  </div>
   <div class="other-stuff">
    Some other stuff that is drawn up if float: right is applied on sticky-element.
    (But shouldn't)
   </div>
</div>

我有一个反应组件 Map，我尝试在其中使用Jsvectormap库来显示地图。问题是地图出现了好几次。我很难理解为什么地图会出现 3 次，因为我只调用了 Map 组件一次。有什么想法可以解决这个问题，以便只显示 1 张地图吗？

这是该Map.jsx组件：

import React, { useEffect } from "react";
import "./Map.css";
import jsVectorMap from "jsvectormap";
import "jsvectormap/dist/maps/world-merc.js";

function Map() {
  useEffect(() => {
    const map = new jsVectorMap({
      selector: "#map",
      map: "world_merc"
    });
  }, []);

  return <div id="map" />;
}

export default Map;

该Map.css文件当前为空，文件App.js如下所示：

import React from 'react'
import Map from './components/Map/Map'

function App() {
  return (
    <div className="App">
      <Map />
    </div>
  );
}

export …

我正在查看这个问题的答案，但我仍然不清楚有什么区别。而现在，他们又增加了一种新的方法getServerSession()。请澄清有什么区别以及何时使用什么

我有这个AppText组件，我想在其中使用Props接口，同时能够接受我可以通过spread operator. 但我收到这个错误：

Type '{ children: string; accessible: true; }' is not assignable to type 'IntrinsicAttributes & Props & { children?: ReactNode; }'.Property 'accessible' does not exist on type 'IntrinsicAttributes & Props & { children?: ReactNode; }'

应用文本：

Type '{ children: string; accessible: true; }' is not assignable to type 'IntrinsicAttributes & Props & { children?: ReactNode; }'.Property 'accessible' does not exist on type 'IntrinsicAttributes & Props & { children?: ReactNode; }'

我是如何使用它的：

<AppText …

我试图将一些框按从框 1 到框 10 的顺序显示为网格。所以它看起来像：

[Box1] [Box2] [Box3] [Box4] [Box5]

[Box6] [Box7] [Box8] [Box9] [Box10]

目前，我的盒子看起来像这样：

[Box1] [Box2] [Box3] [Box4] [Box5] [Box6] [Box7] 

[Box8]               [Box9]               [Box10]

[Box1] [Box2] [Box3] [Box4] [Box5]

[Box6] [Box7] [Box8] [Box9] [Box10]

[Box1] [Box2] [Box3] [Box4] [Box5] [Box6] [Box7] 

[Box8]               [Box9]               [Box10]

知道我做错了什么吗？

我一直用mini-css-extract-pluginCSS来优化。今天我发现了一个新项目，css-minimizer-webpack-plugin从这里看，这个项目似乎做了同样的事情mini-css-extract-plugin。

优点是什么css-minimizer-webpack-plugin？我读了谷歌的文档和文章，似乎没有人在谈论它？我应该用css-minimizer-webpack-plugin来替换mini-css-extract-plugin吗？

我有一个侧边栏，其位置设置为相对：

.home-left-sidebar,
.home-right-sidebar {
  flex: 1;
  color: rgb(66, 66, 66);
  font-size: 17px;
  position: relative !important;
}

它有一个设置为固定的子项：

.left-sidebar {
  position: fixed;
  right: 0;
}

但由于某种原因，孩子并没有粘在父 div 上，而是粘在了 body 上。

<div className='home-left-sidebar '>
  <LeftSidebar />
</div>

<div className='left-sidebar'>
      <div className='left-sidebar-items'>
        <ul>
          <NavLink to='/home/popular'>
            <li>Home</li>
          </NavLink>
          <NavLink to='/home/new'>
            <li>Newest</li>
          </NavLink>
          <NavLink to='/home/likes'>
            <li>My Likes</li>
          </NavLink>
          <NavLink to='/home/user/posts'>
            <li>My Posts</li>
          </NavLink>
        </ul>
      </div>
    </div>

我不知道我在这里做错了什么。

我有 3 个按钮和 3 个内容。当我点击任何按钮时，我想显示该按钮的内容。当我点击另一个按钮时，我想显示该按钮的内容并删除另一个按钮的内容。

我设法用简单的逻辑来做到这一点，但是如何用 for 循环来做到这一点？

const content = document.querySelectorAll('.content');
const contentClose = document.querySelector('.close-content');
const btnsOpenContent = document.querySelectorAll('.show-content');


btnsOpenContent[0].addEventListener('click',
  function() {
    content[1].classList.remove('show-modal');
    content[2].classList.remove('show-modal');
    content[0].classList.add('show-modal');
  }
)

btnsOpenContent[1].addEventListener('click',
  function() {
    content[0].classList.remove('show-modal');
    content[2].classList.remove('show-modal');
    content[1].classList.add('show-modal');
  }
)

btnsOpenContent[2].addEventListener('click',
  function() {
    content[0].classList.remove('show-modal');
    content[1].classList.remove('show-modal');
    content[2].classList.add('show-modal');
  }
)

我正在为学校做一个小项目，我是表达和依赖注入的新手。我开始这个小项目只是为了了解它是如何工作的。我花了几个小时试图理解这个错误，但我没有找到任何相关内容。感谢您的帮助 ！

TypeError: Cannot read properties of undefined (reading 'service')
    at controllerMethod (D:\Projects\Typescript\third\dist\app.controller.js:20:14)
    at Layer.handle [as handle_request] (D:\Projects\Typescript\third\node_modules\express\lib\router\layer.js:95:5)
    at next (D:\Projects\Typescript\third\node_modules\express\lib\router\route.js:144:13)
    at Route.dispatch (D:\Projects\Typescript\third\node_modules\express\lib\router\route.js:114:3)
    at Layer.handle [as handle_request] (D:\Projects\Typescript\third\node_modules\express\lib\router\layer.js:95:5)
    at D:\Projects\Typescript\third\node_modules\express\lib\router\index.js:284:15
    at Function.process_params (D:\Projects\Typescript\third\node_modules\express\lib\router\index.js:346:12)
    at next (D:\Projects\Typescript\third\node_modules\express\lib\router\index.js:280:10)
    at Function.handle (D:\Projects\Typescript\third\node_modules\express\lib\router\index.js:175:3)
    at router (D:\Projects\Typescript\third\node_modules\express\lib\router\index.js:47:12) 

这是代码：

//app.ts
import express, { json, urlencoded } from 'express'
import { APPROUTE } from './app.route'

const app = express()

app.use(json())
app.use(urlencoded({ extended: false }))
app.use(APPROUTE)

app.listen(5000, ()=>{
    console.log(`connected on port 5000`)
})


//app.controller.ts
import { Request, …

我正在尝试将以下数据转换为：

{
      title: 'The Promise',
      blurb: 'Lorem Ipsum',
      cover_image: 'Lorem Ipsum',
      pub_year: 2002,
      genre: 'Foobar'
    }

到：

[
 {
   col1: 'The Promise',
   col2: 'Lorem Ipsum',
   col3: 'Lorem Ipsum',
   col4: 2002
   col5: 'Foobar'
 },
]

我已经对此困惑了很长一段时间，只能让它看起来像这样，这只是单独的对象，而不是作为对象数组一部分的单个对象（从我的数据库返回的 JSON 中还有其他书籍对象）该函数需要进行迭代）

{col1: 1} //this is an id
{col2: 'The Promise'}
{col3: 'Lorem ipsum'}
{col4: Lorem Ipsum}
{col5: '2002'}
{col6: Foobar}

这是我一直在研究的代码：

 const data = React.useMemo(
    () =>
      props.tableData.map((object, i) => {
        Object.values(object).map((value, i) => {
          let col = `col${i + 1}`
          const obj = …