小编Sha*_*iar的帖子

我有一个带有文字的盒子。默认情况下它只显示 2 行，当用户将鼠标悬停在其上时显示整个文本。但是，我在动画化时遇到问题。显示属性似乎不可设置动画。

我怎样才能让它动起来？
如果有帮助的话，我也在使用“framer-motion”，如果您有使用它的解决方法，那就没问题了。

.box {
  transition: all 0.3s ease-in-out; /* doesn't work */
}

.title {
  color: green;
  font-weight: bold;
}

.text {
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;  
   overflow: hidden;
   
   transition: all 0.3s ease-in-out; /* doesn't work */
}

.box:hover .text {
   display: block;
}

<div class="box">
  <span class="title">Title</span>
  <div class="text">
  Et eirmod erat diam ipsum sit diam ut et est at ut tempor consequat nisl duis ut justo sit. Aliquyam adipiscing et esse consetetur dolores et …

我在 macOS 中使用 React.js，当我尝试调用 时axios.get，出现网络错误。我读过许多像我这样使用 React Native 的其他案例，答案是添加设置以允许它们http在 mac 中使用而不是https在 mac 中使用，但该设置不能在 React js 中使用。

任何意见，将不胜感激。

Error: Network Error
    at createError (createError.js:17)
    at XMLHttpRequest.handleError (xhr.js:87)

我的代码是这样的：

try {
  const Response = await axios.get(http://xxxxx/WebServiceTest/service.svc?wsdl/GetItems, {
   
    params: {
      Number: "100",
      Id: "101",
      userName: "11",
      credential: "Test"
    }
  });
  console.log("http response = " + Response.data);
} catch (ex) {
  console.log("error.status:", ex);
}

三天前，我突然发现，我之前使用 Google 字体中的“Open sans”字体作为主要字体构建的一些网站在 Chrome 上看起来很奇怪、不连贯且像素化。

我已经尝试了几种修复方法，从调整 Windows 上的 ClearType 到禁用标志（加速 2d 画布）以及禁用 Chrome 上的硬件加速，几乎尝试了我在互联网上可以找到的所有内容，但没有任何效果。

我还尝试从 Windows 字体文件夹中删除“Open sans”，但该字体在我的网站上看起来仍然像素化。在我删除它之前，它在 Photoshop 中很好。

这是我目前看到的屏幕截图。

打开没有奇怪的行为

该p标签使用简单的 CSS 进行测试

font-family: 'Open sans';
font-size: 12px; / 20px (on the bellow paragraph)
font-weight: 700; / 400 (on the bellow paragraph)
-webkit-font-smoothing: antialiased;

在样式上，我有默认的 @import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400 ;1,500;1,600;1,700;1,800&display=交换'); 来自谷歌字体。

任何人都可以阐明吗？任何帮助表示赞赏。我真的不想因为这个该死的有缺陷的字体而格式化我的电脑。还在 Edge 和 Opera GX 上进行了测试，它也发生在它们上。

我的项目结构是这样的：

jsconfig.json
next.config.json
components
   |_atoms
       |_Button.jsx
       |_Button.module.scss
       |_...
   |_...
...

在 里面jsconfig.json，我有这个：

{
   "compilerOptions": {
      "baseUrl": ".",
      "paths": {
         "@/components/*": ["components/*"]
      }
   },

   "include": ["components/**/*", "api/**/*", "data/**/*", "pages/**/*", "utils/**/*"]
}

Next.js 正确导入了组件并且它正在工作，但在开发方面，自动完成功能不再工作了！

例如，所有这些导入语句都像魅力一样工作，但我手动编写了路径并且自动完成没有帮助：

jsconfig.json
next.config.json
components
   |_atoms
       |_Button.jsx
       |_Button.module.scss
       |_...
   |_...
...

所以 next js 没有问题，但Path Intellisense不再建议文件名。
我重命名jsconfig.json为其他名称（以禁用它），这一次，Path Intellisense 工作正常，但 next js 无法导入组件。

我怎样才能从两者中受益？我想要绝对导入并使用路径智能感知。

我是 Stylelint 的新手。我试图理解文档并搜索了 GitHub，但所有解释都充满了双重否定，我很困惑！
问题是，当我使用//注释时，它会抛出Unknown word (CssSyntaxError)Stylelint(CssSyntaxError).

例子：

我该如何解决这个问题，或者禁用注释行上的 Stylelint 检查？

为什么<select>标签是readonly默认的？

select:read-only {
    background-color: orange;
}

<select>
    <option value="lizard">lizard</option>
    <option value="giraffe">giraffe</option>
    <option value="lion">lion</option>
</select>

我的问题是，如果<select>没有只读属性（https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select#attributes）并且它的等效属性是disabled，那么为什么CSS选择器有效并且样式已应用到它？

在 JS 中，我有一个名为的类player：

class player {
    constructor(name) {
        this.name = name;
    }
}

我有两个实例，称为PL1和PL2：

const PL1 = new player ('pl1name');
const PL2 = new player ('pl2name');

我还有一个名为的数组PLAYERS：

let PLAYRES = [];

现在，问题是如何创建一个包含类的所有实例的数组player？

我知道我可以用PLAYERS.push(PLn手动执行此操作)；但我正在寻找一种以某种方式自动执行此操作的方法。有内置函数吗？我应该使用循环吗？

我开始下载Beekeeper Studio和Prisma Studio。两者的.exe文件都托管在 GitHub 上。一切都很好，但接近 90% 时，两者都停止下载；我尝试停止/启动，然后出现一个弹出窗口，要求授权！

我正在使用IDM：

我在这里问这个问题是因为我不知道问题是什么。GitHub？我的互联网连接？IDM？

children是否可以为react设置一个名称以获得更好的代码可读性？
我想要这样的东西：

default function LinksBar({ links = children }) {
    return (
        <div>
            {links} {/* instead of {children} */}
        </div>
    )
};

我知道我可以通过道具传递它们，但我不想这样做（只是因为个人喜好）。

我不想要这个：

<LinksBar links={<><Link href="1" /><Link href="2" /><>} />

我要这个：

<LinksBar>
    <Link href="1" />
    <Link href="2" />
<LinksBar/>

为了干净的代码和文件夹结构，我将一些数据（在本例中为模态数据）移动到单独的文件中。但是，我无法将组件放入对象值中。这就是我想做的：

export function invalidId(id) {
   return {
      info: {
         title: "Invalid ID!",
         message: (
            <>
               The 
               <code className="inline-code">{id}</code>
               is invalid. Please make sure blah blah blah...
            </>
         ),
      },


      // I need help with this part
      buttons: {
         <>
            <Button label="Retry" />
            <Button label="More Info" >
         </>   
      }
   }
}

import { invalidId } form "modaldata";

setModalInfo(invalidId(id).info);
setModalButtons(invalidId(id).buttons);

我return在这里使用是因为id它是动态的。主要问题是buttons部分。将 JSX 放入对象中的正确方法是什么？