javascript observable js input options基于之前选择的输入

eulz3vhy 于 2023-05-12 发布在 Java

关注(0)|答案(2)|浏览(190)

我对可观察的js（或者更确切地说，任何与js / html相关的东西）都很陌生，所以这可能是一个非常愚蠢的问题，我可能没有掌握一些核心概念。我会非常感谢任何提示我错了什么。
我尝试构建两个Inputs，以便查看者可以首先选择他们想要检查的数据集，然后根据他们的数据集选择决定他们感兴趣的变量。我不能让第二个方面工作。
这是我到目前为止编写的代码，当我尝试使用const定义基于数据集的选项时，我得到了一个错误。

viewof dataset = Inputs.select(
  ["Datset 1", "Dataset 2", "Dataset 3"], 
  {label: "Which Dataset would you like to use?", value: "dataset"}
)

viewof variables = Inputs.select(
  [], 
  {label: "Which Variable would you like to inspect?", value: "variable"}
)

{const datasetOptions = 
  "Dataset 1": ["a", "b"],
  "Dataset 2": ["c", "d"],
  "Dataset 3": ["c", "f", "g"]
}

dataset.on("change", () => {
  variables.options = datasetOptions[dataset].options;
  variables.value = variables.options[0];
});

这是用ojs（@observablehq）在RStudio的夸托文档中编写的。
我会很感激任何提示，我应该寻找一个解决方案！我真的很感激！

JavaScript

来源：https://stackoverflow.com/questions/76210733/observable-js-input-options-based-on-selected-input-before

2条答案

按热度按时间

8cdiaqws1#

要在Observable中工作，必须像这样声明datasetOptions对象：

datasetOptions = ({
  "Dataset 1": ["a", "b"],
  "Dataset 2": ["c", "d"],
  "Dataset 3": ["c", "f", "g"]
})

你可以在这里阅读更多关于Observable JavaScript的语法与vanilla JavaScript的不同之处：https://observablehq.com/@observablehq/observable-javascript。
此外，Observable网站的一些功能在OJS语言中不可用。有关夸托中OJS的帮助，此论坛可能会有所帮助：https://github.com/quarto-dev/quarto-cli/discussions/categories/q-a

赞(0）回复(0）举报 2023-05-12

z5btuh9x2#

我认为下面的代码块应该可以让你接近你想要的。请注意，Observable具有内置的React性，这是使其超级易于使用的原因之一。如果你有

viewof x = Inputs...

然后，在后续的JavaScript代码中，变量x将引用x的值。特别是，您通常不需要像

my_input.on("change", () => {...})

因为更改由Observable运行时处理。

---
title: "Selecting Selects"
author: "MM"
format:
  html:
    echo: false
---

**Which dataset would you like to use?**
```{ojs}
viewof dataset = Inputs.select(
  ["Dataset 1", "Dataset 2", "Dataset 3"],
  {
    // Labels should generally be short and concise.
    label: "Dataset:", 
    value: "Dataset 1"
  }
)

Which variable would you like to use?

viewof variables = Inputs.select(
  // the `dataset` variable refers to the
  // value of the previous inputs.
  datasetOptions[dataset],
  {
    value: "variable",
    label: "Variable:"
  }
)

Here are your results:

Dataset: ${dataset}
Variables to choose from: ${datasetOptions[dataset]}
Selected variable: ${variables}

datasetOptions = ({
  "Dataset 1": ["a", "b"],
  "Dataset 2": ["c", "d"],
  "Dataset 3": ["c", "f", "g"]
})

赞(0）回复(0）举报 2023-05-12

我来回答

javascript observable js input options基于之前选择的输入

2条答案

相关问题

热门标签

最新问答