小编Jax*_*axx的帖子

如何在我的 *.svelte 文件中配置自动格式化?

我是 Svelte (以及一般框架)的新手,我已经建立了一个 Svelte 项目并正在尝试一些事情。

但格式确实让我分心,目前我的代码被自动格式化为( Shift + Option + F ):

在此输入图像描述

我有办法配置这个吗?

我试过了:

  • 将密钥添加prettier到我的package.json
  • 在vscode文件夹中添加settings.json文件,内容如下:

    {
        "prettier.tabWidth": 4,
    }

Run Code Online (Sandbox Code Playgroud)

除了更改选项卡大小之外,我还希望将上图中的代码自动格式化为:


    config = Object.assign({
        mass: 1,
        stiffness: 100,
        damping: 10,
        velocity: 0
    }, config);

Run Code Online (Sandbox Code Playgroud)

模板代码也自动格式化为:

在此输入图像描述

我认为如果像这样的话会更容易阅读:


    <FadeIn
        from={{ blur: 8, scale: 0.6 }}
        config={{ stiffness: 10, damping: 20 }}
    >
        <p>Hello</p>
    </FadeIn>

Run Code Online (Sandbox Code Playgroud)

请知道如何配置的帮我一下,谢谢!

code-formatting visual-studio-code svelte

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

为什么我无法访问 svelte3 脚本标签内的“$:”又名反应变量?

我对 svelte 还很陌生,一周前就开始了......

\n\n

我想知道我真的很喜欢\xe2\x9d\xa4\xef\xb8\x8f\xe2\x9d\xa4\xef\xb8\x8f它但我有一个问题\xe2\x98\xb9\xef\xb8 \x8f\xe2\x98\xb9\xef\xb8\x8f

\n\n

我正在尝试访问脚本标签中的 $: 变量,但出现 Error Cannot access \'greeting\' before initialization

\n\n
<script>\n    let name = \'world\';\n    $: greeting = `Hello ${name}`\n    console.log(greeting)\n</script>\n\n<h1>Hello {name}!</h1>\n
Run Code Online (Sandbox Code Playgroud)\n\n

我还尝试在使用它之前用let声明变量

\n\n
    let greeting\n
Run Code Online (Sandbox Code Playgroud)\n\n

但在这种情况下console.log输出undefined.

\n

svelte svelte-3 reactive-variable

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

在React组件中获取子元素的高度

在React组件内部,我希望能够计算每个子容器的总高度,在这种情况下,这是三个h3元素,以便在为其高度动画化时可以计算父div的确切高度。我已经看过基本js以及使用组件安装方法的示例,但是如何仅使用JavaScript来获取这些元素的高度呢?

class Div extends React.Component {
  render() {
    return (
      <div>
        <h3>Description One</h3>
        <h3>Description Two</h3>
        <h3>Description Three</h3>
      </div>
    );
  }
}

ReactDOM.render(<Div />, app);
Run Code Online (Sandbox Code Playgroud)
div {
  background-color: pink;
}
Run Code Online (Sandbox Code Playgroud)
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.1.0/react-dom.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="app"></div>
Run Code Online (Sandbox Code Playgroud)

javascript dom reactjs

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