小编Fre*_*ors的帖子

您能帮我理解这两个组件之间的区别吗：

REPL：https://codesandbox.io/s/svelte-onmount-or-not-yhu91

• 使用 onMount：

<script>
  import { onMount } from "svelte";

  let canRender;

  onMount(() => {
    setTimeout(() => {
      canRender = true;
    }, 1000);
  });
</script>

{#if canRender}I'm with onMount!{/if}

• 没有 onMount：

<script>
  let canRender;

  setTimeout(() => {
    canRender = true;
  }, 1000);
</script>

{#if canRender}I'm without onMount!{/if}

canRender我的意思是，在很多情况下，由于许多事件或者因为我正在等待 props 的一些延迟，我需要使用布尔值 ( ) 来处理组件的创建。

表演怎么样？

最终代码有什么不同？

我还有其他方法可以做到这一点吗？

有没有办法在 Svelte 3 中绑定对象字段？

例子：

<script>
  import MyComponent from "./MyComponent.svelte"
  let myobjectID
</script>

<MyComponent bind:myobject[id]={myobjectID}>

<!-- Where myobject == {id: "123", name: "myName", and so on...} -->

这可能吗？

我错了还是这应该href从标签中删除属性a？

<a href={false}></a>

它没有（“svelte”：“3.44.2”）。

我有这个功能：

pub async fn player(&self, id: &str) -> Result<Option<Box<dyn AsyncRead + Send>>> {
    // use id here...
    let file = tokio::fs::File::open("player.pdf").await?;
    let res = Some(Box::new(file));
    Ok(res)
}

它不起作用：

error[E0308]: mismatched types
    |
46  |         Ok(res)
    |         -- ^^^ expected trait object `dyn tokio::io::AsyncRead`, found struct `tokio::fs::File`
    |         |
    |         arguments to this enum variant are incorrect
    |
    = note: expected enum `std::option::Option<std::boxed::Box<dyn tokio::io::AsyncRead + std::marker::Send>>`
               found enum `std::option::Option<std::boxed::Box<tokio::fs::File>>`
note: tuple variant defined here
   --> C:\Users\Fred\.rustup\toolchains\stable-x86_64-pc-windows-msvc\lib/rustlib/src/rust\library\core\src\result.rs:508:5
    |
508 |     Ok(#[stable(feature = …

我正在尝试渲染一个包含未知数量项目（生成的javascript）的动态（css）网格。

我需要的是让所有项目（明显调整大小）的宽度为 100%，高度为 100%。

例子：

• 1 项目： 大方块
• 2 项：2 个大正方形（2 个水平柱）
• 3 项：屏幕分为 4 个方格，1、2、3 个 div，4 个（最新的）为空
• 4 项目： 4 个正方形的屏幕
• 等等...
• 1920 个项目（在 1920x1080 显示屏上）：在相同数量的列和行中，每个项目的大小都调整得非常小（考虑到之间的间隙，可能只有一个像素或更小）（内部没有文本）（但这只是一个极端的例子，仅用于意义！）

我独自完成的事情：https ://jsfiddle.net/fredhors/s4k3z9t2/8/

CSS：

.grid-wrapper {
  display: grid;
  grid-template-columns: repeat(auto-fit, 10vmax);
  grid-gap: 0.5rem;
  height: 100vh;
}

.grid-item {
  background: red;
}

我正在使用生成以下 Postgresql 查询的工具：

SELECT
    "id",
    "score"
FROM
    "players"
WHERE
    "score" > '11266' OR ( "score" = '11266' AND "id" > '4482' )
ORDER BY
    "score" ASC,
    "id" ASC
    LIMIT 3

我需要了解为什么OR运营商？

我的玩家表可以有很多行相同score但不相同id。

OR当多行具有相同的score值时是否需要这样做？

脚步

1. 继续 REPL：https ://codesandbox.io/s/css-sidebar-animation-100-transform-wxchf ? file =/ App.svelte
2. 单击“切换侧边栏”按钮
3. 动画流畅，流畅
4. 取消注释第 28 行
5. 第 29 行评论
6. 再次点击按钮
7. heavy()调用toggleSidebar()函数时动画停止（在函数中）

问题

我不明白为什么会这样？

如果我更改-200px为-100%正在发生的事情会导致动画停止吗？

我该如何解决这个问题？如果我事先不知道侧边栏宽度怎么办？如果是动态的呢？

代码

.sidebar {
  animation: sidebar-slide-right 3s ease-out;
}

@keyframes sidebar-slide-right {
  0% {
    /* transform: translateX(-100%); */
    transform: translateX(-200px);
  }
  100% {
    transform: translateX(0);
  }
}

我是第一次使用 Preact。

我只是用 preact-cli 和这个默认模板创建了一个新项目：https : //github.com/preactjs-templates/default。

在app.js我尝试使用此代码时：

import { Router } from 'preact-router';

import Header from './header';
import Home from '../routes/home';
import Profile from '../routes/profile';

// I added this function
function sleep(ms) {
    return new Promise(resolve => setTimeout(resolve, ms));
}

const App = async () => { // I added "async" and the "{" in this line
  await sleep(3000) // I added this line

  return ( // I added this line
    <div id="app">
      <Header /> …

我正在使用axum此代码来创建服务器，但出现错误：

use axum::{response::Html, routing::get, Router};

async fn handler() -> Html<&'static str> {
    Html("<h1>Hello, World!</h1>")
}

#[tokio::main]
async fn main() {
    let router = Router::new();

    router.route("/", get(handler));

    if true { // I need to check something here
        router.route("/other", get(handler));
    }

    axum::Server::bind(&([127, 0, 0, 1], 3000).into())
        .serve(router.into_make_service())
        .await
        .unwrap();
}

error[E0382]: use of moved value: `router`
  --> src\main.rs:18:16
   |
9  |     let router = Router::new();
   |         ------ move occurs because `router` has type `Router`, which does not implement the `Copy` …

我正在使用这段代码：

let players: Vec<Player> = players_to_create
    .iter()
    .map(|o| Player::new(&o.id, &o.team_id, &o.name)?)
    .collect();

但我收到此错误：

error[E0277]: the `?` operator can only be used in a closure that returns `Result` or `Option` (or another type that implements `FromResidual`)
  --> src/main.rs:17:57
   |
17 |         .map(|o| Player::new(&o.id, &o.team_id, &o.name)?)
   |              ---                                        ^ cannot use the `?` operator in a closure that returns `Player`
   |              |
   |              this function should return `Result` or `Option` to accept `?`
   |
   = help: the trait `FromResidual<Result<Infallible, ()>>` is not …