主页 / user-3416774

Ooker's questions

Martin Hope
Ooker
Asked: 2024-11-21 14:54:44 +0800 CST
  • 6

来自页面交互 | Puppeteer：

推荐使用定位器来选择元素并与其交互。定位器封装了有关如何选择元素的信息，它们允许 Puppeteer 自动等待元素出现在 DOM 中并处于执行操作的正确状态。您始终使用 page.locator() 或 frame.locator() 函数实例化定位器。如果定位器 API 未提供您需要的功能，您仍然可以使用较低级别的 API，例如 page.waitForSelector() 或 ElementHandle。

locator()下表总结了我对和之间区别的理解$()：

Page方法 返回类 等待元素出现在 DOM 中？ 需要await？ 输入法
locator() Locator 是（重试直到成功或超时） 不 只有click，，，hover​scroll​
$() ElementHandle 不 是的 各种各样的

我有一些问题：

  • 如果locator()等待元素出现在 DOM 中，那么是不是必须有await？同样，如果$()不等待，那么是不是就不需要await？
  • 为什么$()一个不等待元素出现在 DOM 中的方法比等待元素出现在 DOM 中的方法拥有更多的设备输入方法？
  • 是不是在引擎盖下面是和locator()的组合？waitForSelector()$()

相关问题：为什么使用 时元素不可点击locator()，但使用 时可点击$()？

javascript
Martin Hope
Ooker
Asked: 2024-11-19 14:48:03 +0800 CST
  • 3

这是将对象属性重新排列到属性列表顶部的方法：

const raw = {
  a: 1,
  b: 2,
  // ...the rest
  y: 3,
  z: 4,
};

const templateTop = {
  y: null,
  z: null,
}

const rearrangedTop = Object.assign(templateTop, raw);
// {
//   y: 3,
//   z: 4,
//   a: 1,
//   b: 2,
//   ...the rest
// };

但是，有没有办法将一些属性重新排列到底部？即

const rearrangedBottom =  {
  // ...the rest
  y: 3,
  z: 4,
  a: 1,
  b: 2,
};
javascript
Martin Hope
Ooker
Asked: 2024-10-07 15:45:56 +0800 CST
  • 5

a我期望和的类型b都被推断为数字。为什么事实并非如此？

const map1 = new Map([
  ["a", 1]
])
const a = map1.get("a") // number | undefined

const map2 = new Map()
map2.set("b", 2)
const b = map2.get("b") // any

操场

typescript
Martin Hope
Ooker
Asked: 2024-09-20 16:25:34 +0800 CST
  • 4

使用git for-each-ref --format="%(objectname:short) %(refname)"我得到：

207e698 refs/heads/main
f78d212 refs/original/refs/heads/main
24f61e4 refs/original/refs/tags/Cấutrúc1
4248ddd refs/original/refs/tags/Cấutrúc1.1
207e698 refs/remotes/origin/main
bc5335c refs/tags/Cấutrúc2.0
a03c71f refs/tags/Cấutrúc2.0.1
c72d77c refs/tags/Cấutrúc2.1.0
03f6aa0 refs/tags/Cấutrúc2.2.0
391fcd5 refs/tags/cấutrúc2.3.0

做什么？ Remove refs/original/heads/master from git repo after filter-branch --tree-filter?refs/original/中的答案说：

refs/original/*可以作为备份，以防您弄乱了过滤器分支。相信我，这真是个好主意。

从评论中，我明白了这不仅是 的备份filter-branch，而且是一种阻止您使用它的方法。我想前面的引言中“非常好的主意”的意思是不使用 是一个非常好的主意filter-branch。但这是唯一触发其创建的操作吗？我看到它有各种子路径：refs/heads、refs/tags、heads。他们想说什么？

git
Martin Hope
Ooker
Asked: 2024-08-26 02:45:47 +0800 CST
  • 5

在我的理解中，unified是一个用语法树处理内容的接口，remark是一组插件。这意味着必须使用unified和附加插件。例如：

import rehypeSanitize from 'rehype-sanitize'
import rehypeStringify from 'rehype-stringify'
import remarkParse from 'remark-parse'
import remarkRehype from 'remark-rehype'
import {unified} from 'unified'

const file = await unified()
  .use(remarkParse)
  .use(remarkRehype)
  .use(rehypeSanitize)
  .use(rehypeStringify)
  .process('# Hello, Neptune!')

console.log(String(file))

但此页面列出了直接使用的示例remark。例如：

import {remark} from 'remark'
import remarkPresetLintConsistent from 'remark-preset-lint-consistent'
import remarkPresetLintRecommended from 'remark-preset-lint-recommended'
import {reporter} from 'vfile-reporter'

const file = await remark()
  .use(remarkPresetLintConsistent)
  .use(remarkPresetLintRecommended)
  .process('1) Hello, _Jupiter_ and *Neptune*!')

console.error(reporter(file))

我不明白为什么它可以这样工作。是不是因为它是一个更专注于某件事remark的版本（或分支） ？unified

remarkjs
Martin Hope
Ooker
Asked: 2024-05-12 03:14:38 +0800 CST
  • 5

在 Preact 中，我想显示一个对象：

export default function Component() {
  const obj = { a: 'a', b: 'b'} 
  const elements = [];
  for (const [key, value] of Object.entries(obj)) {
    elements.push(<>{key}: {value}<br></br></>)
  }
  return (
    <article>
      {elements}
    </article>
  );
}

这返回正常：

a: a
b: b

但是，如果我将该元素提取到一个单独的 JSX 元素中，如下所示：

function Element({ key, value }) {
  return (<>{key}: {value}<br></br></>);
}
export default function Component() {
  const obj = { a: 'a', b: 'b'} 
  const elements = [];
  for (const [key, value] of Object.entries(obj)) {
    // elements.push(<>{key}: {value}<br></br></>)
    elements.push(<Element key={key} value={value} />)
  }
  return (
    <article>
      {elements}
    </article>
  );
}

然后键全部变得未定义：

: a
: b

为什么会出现这种情况？

操场

object
Martin Hope
Ooker
Asked: 2024-05-08 17:24:28 +0800 CST
  • 3

我使用useState()Deno Fresh 中的钩子，它基于 Preact。在一个岛上我有：

import { useState } from "preact/hooks";

export default function(){
  const [state, setState] = useState('hi')
  const str = 'a'
  setState(str)
  console.log(state)
}

这很好用。但如果我使用一个对象来代替：

- const str = 'a'
- setState(str)
+ const obj = {a: 'a'} 
+ setState(obj)

然后就陷入了无限循环。这是为什么？

reactjs
Martin Hope
Ooker
Asked: 2024-05-04 21:22:28 +0800 CST
  • 4

我想尝试一下toSpliced()方法：

const a = [1, 2] as const 
const b = a.toSpliced(0, 1, 'hi')

这给出了错误：Argument of type '"hi"' is not assignable to parameter of type '1 | 2'

我尝试复制数组：

const copiedA = [...a] //or
const copiedA = a.map(x => x)

或输入断言：

const b = a.toSpliced(0, 1, 'hi') as any

但这些都不起作用。有办法避免这种情况吗？

arrays
Martin Hope
Ooker
Asked: 2024-04-07 17:23:30 +0800 CST
  • 4

我routes/index.tsx有：

import Main from "../islands/Counter.tsx";

export default function Home() {
  return (<Main />);
}

我islands/Counter.tsx有：

import { useState } from "preact/hooks";

export default function Main() {
  const [count, setCount] = useState<number>(0);
  return (
    <main>
      <button onClick={setCount(count + 1)}>click</button>
      {count}
    </main>
  );
}

第一个渲染显示数字 24，并且 Firefox 表示“此页面正在减慢 Firefox 的速度”。我哪一部分做错了？

reactjs
Martin Hope
Ooker
Asked: 2024-01-31 00:44:19 +0800 CST
  • 5

我使用 Fresh、TailwindCSS 和 daisyUI 组件来构建一个小高度页脚，并进行了一些修改：

import IconSphere from "https://deno.land/x/[email protected]/tsx/sphere.tsx"
import IconBrandFacebook from "https://deno.land/x/[email protected]/tsx/brand-facebook.tsx"
import IconBrandDiscord from "https://deno.land/x/[email protected]/tsx/brand-discord.tsx"

export default function Footer() {
    return (
        <footer class="footer items-center p-4 bg-neutral text-neutral-content">
            <aside class="items-center grid-flow-col gap-8">
                <span class='text-2xl italic font-mono font-bold tracking-wide'>Trấn Kỳ</span>
                        <a class="link link-hover">Trấn Kỳ là gì?</a>
                        <a class="link link-hover">Lý do viết Trấn Kỳ</a>
                        <a class="link link-hover">Kế hoạch phát triển Trấn Kỳ</a>
                        <a class="link link-hover">Tích hợp Trấn Kỳ vào hệ thống của bạn</a>
                        <a class="link link-hover">Các buổi đáp ứng nhu cầu tự học lập trình</a>
            </aside> 
            <nav class="grid-flow-col gap-4 md:place-self-center md:justify-self-end">
                <IconSphere class="w-6 h-6" />
                <IconBrandDiscord class="w-6 h-6" />
                <IconBrandFacebook class="w-6 h-6" />           
            </nav>
        </footer>
    )
}

（顺风游乐场）

在大屏幕上它是完美的：

在中等屏幕上，当文本最多 2 行时，效果也不错：

然而，在小屏幕上，我不希望文本像这样被压扁：

在元素中<aside>，如果我删除grid-flow-col gap-8类并仅使用items-center，那么它在移动设备上按预期工作：

我尝试这段代码：

<aside class="items-center md:grid-flow-col md:gap-8">

但随后它保留了小屏幕到中大屏幕的布局。

简而言之，我想建立一个页脚：

  • 列出所有链接并排列出，每个链接最多有两个文本行
  • 如果不可能，则逐行列出它们

有办法实现吗？

css
Martin Hope
Ooker
Asked: 2023-12-02 15:14:24 +0800 CST
  • 5

我希望能够做到这一点：

>>> obj = Example('hi', 'hello')
>>> obj.a 
'hi'
>>> obj.sub_obj.b
'hello'

我尝试这个但我得到AttributeError: 'dict' object has no attribute 'b'：

class Example:
    def __init__(self, a, b):
        self.a = a
        self.sub_obj = {} 
        self.sub_obj.b = b

我看到一个类似的问题，但我不太明白：Can pythonobjectshavenestedproperties? 。我只希望输出 JSON 具有嵌套对象。API 要求我这样做。

python
Martin Hope
Ooker
Asked: 2023-10-11 01:00:05 +0800 CST
  • 6

我运行这个命令：

Get-ChildItem -recurse -file | ForEach-Object { (Get-Content $_).Replace('hi there','hello') | Set-Content $_ }

并得到这个错误：

InvalidOperation: You cannot call a method on a null-valued expression.
InvalidOperation: You cannot call a method on a null-valued expression.

你知道这是为什么吗？

powershell
Martin Hope
Ooker
Asked: 2023-09-24 14:22:27 +0800 CST
  • 5

我有这个脚本：

type Input = string
function util(input: Input) {
    return input
}

function main(input: Input | null) {
    const isNull = input === null
    if (isNull) {
        return 'empty string'
    }    
    input = util(input) //error
}

错误是：Argument of type 'string | null' is not assignable to parameter of type 'string'. Type 'null' is not assignable to type 'string'.

但是，如果出现以下情况，则不会发生：

  • 最后一行是return util(input), 或
  • 条件线缩短为if (input === null)

这是为什么？

TS游乐场

typescript
Martin Hope
Ooker
Asked: 2023-08-28 23:16:37 +0800 CST
  • 5

我有这个项目：

script.sh:

#!/bin/sh
echo "test"

Dockerfile:

FROM ubuntu
RUN ["sh", "script.sh"]

使用 build 命令docker build -t test .，我收到此错误：

 => [internal] load .dockerignore                                                                                  0.1s
 => => transferring context: 2B                                                                                    0.0s
 => [internal] load build definition from Dockerfile                                                               0.1s
 => => transferring dockerfile: 118B                                                                               0.0s
 => [internal] load metadata for docker.io/library/ubuntu:latest                                                   2.3s
 => [auth] library/ubuntu:pull token for registry-1.docker.io                                                      0.0s
 => CACHED [1/2] FROM docker.io/library/ubuntu@sha256:ec050c32e4a6085b423d36ecd025c0d3ff00c38ab93a3d71a460ff1c44f  0.0s
 => ERROR [2/2] RUN ["sh", "script.sh"]                                                                            0.9s
------
 > [2/2] RUN ["sh", "script.sh"]:
#0 0.791 sh: 0: cannot open script.sh: No such file
------
Dockerfile:2
--------------------
   1 |     FROM ubuntu
   2 | >>> RUN ["sh", "script.sh"]
--------------------
ERROR: failed to solve: process "sh script.sh" did not complete successfully: exit code: 2

但是，如果我将 Dockerfile 更改为：

FROM ubuntu
CMD ["sh", "script.sh"]

然后它就起作用了：

[+] Building 1.2s (5/5) FINISHED
 => [internal] load build definition from Dockerfile                                                               0.1s
 => => transferring dockerfile: 73B                                                                                0.0s
 => [internal] load .dockerignore                                                                                  0.0s
 => => transferring context: 2B                                                                                    0.0s
 => [internal] load metadata for docker.io/library/ubuntu:latest                                                   1.0s
 => CACHED [1/1] FROM docker.io/library/ubuntu@sha256:ec050c32e4a6085b423d36ecd025c0d3ff00c38ab93a3d71a460ff1c44f  0.0s
 => exporting to image                                                                                             0.0s
 => => exporting layers                                                                                            0.0s
 => => writing image sha256:d9bf124a17e507c73f6defde7b046fff153fb464c2cad8a57333a0966ddf07c1                       0.0s
 => => naming to docker.io/library/test                                                                            0.0s

来自Dockerfile 中 RUN 和 CMD 的区别：

RUN - 命令在我们构建 docker 镜像时触发。

CMD - 当我们启动创建的 docker 镜像时触发命令。

不过，我无法解释为什么 RUN 不起作用而 CMD 起作用。

bash