Error: object was provided as `children` instead of a component, string, or number (or list of those)

user_13782354 0
Viewed 3535

I can't seem to find out why this error pops up in Developer Console. The script runs perfectly in R and has worked before. I remember deleting a callback from the script but that is it. Below is the R script containing the app layout html section. Can anyone help with this?

app$layout(
  htmlDiv(
    children = list(
      htmlDiv(
        list(
          htmlDiv(
            list(
              htmlH3(
                "Maternal Health Dashboard",
                style=list("margin-bottom"= "0px",
                           "text-align" = "center")
              )
            )
          )
        ),
        className="row flex-display",
        id="title",
        style=list("margin-bottom"= "25px")
      ),
      htmlDiv(
        list(
          htmlP("Tabs", className="tabs"),
          dccRadioItems(
            id="tab_buttons",
            options = list(
              list("label"= "General", "value"= "general"),
              list("label"= "Antenatal", "value"= "antenatal_risk"),
              list("label"= "Postnatal ", "value"= "postnatal_details"),
              list("label"= "LBW Child ", "value"= "LBW_details")
            ),
            value="general",
            labelStyle=list("display"= "inline-block","text-align" = "center"
            ),
            className="dcc_control"
          )
        )
      ),
      htmlDiv(
        id = "map-container",
        list(
          htmlP("Map of Maternal Health",
                id = "map-title",
          ),
          dccGraph(figure=fig
          )
        )
      ),
      htmlDiv(
        list(
          htmlP("Total GP "),
          htmlP("Total Sub Centers  "),
          htmlP("Total Villages "),
          htmlP("Total Beneficiary Women  "),
          htmlP("Total Postnatal Women  "),
          htmlP("Total Neonatal Women   ")
        ),
        style= list("display"= "flex","border"= "2px solid powderblue","white-space" = "normal", "justify-content" = "space-around"),
        id="info-container",
        className="row container-display"
      ),
      htmlDiv(
        id = "graph-container",
        list(
          htmlP(id="chart-selector",
                children = "Select chart:"
          ),
          dccDropdown(
            options = list(list("label"= "Total number of infants per Woman ",
                                "value"= "show_absolute_deaths_single_year"),
                           list("label"= "COVID-19 Cases",
                                "value"= "absolute_deaths_all_time"),
                           list("label"= "Total number of post-natal immunizations",
                                "value"= "show_death_rate_single_year"),
                           list("label"= "",
                                "value"= "death_rate_all_time")),
            value="show_death_rate_single_year",
            id="chart-dropdown"
          ),
          dccGraph(
            id = "selected-data"
          )
        )
      ),
      id="mainContainer",
      style = list(
        "position" = "relative",
        "box-sizing" =  "border-box"
      )
    )))


app$run_server()
plotly-dashr plotly-dash plotly r html
1 Answers

I code Dash in Python, not R, but I suspect the behaviors are similar enough that your problem is coming from these two places:

      htmlDiv(
        id = "map-container",
        list(
          htmlP("Map of Maternal Health",
                id = "map-title",
          ),
          dccGraph(figure=fig
          )
        )
      ),

      htmlDiv(
        id = "graph-container",
        list(
          htmlP(id="chart-selector",
                children = "Select chart:"
          ),
          dccDropdown(
            options = list(list("label"= "Total number of infants per Woman ",
                                "value"= "show_absolute_deaths_single_year"),
                           list("label"= "COVID-19 Cases",
                                "value"= "absolute_deaths_all_time"),
                           list("label"= "Total number of post-natal immunizations",
                                "value"= "show_death_rate_single_year"),
                           list("label"= "",
                                "value"= "death_rate_all_time")),
            value="show_death_rate_single_year",
            id="chart-dropdown"
          ),
          dccGraph(
            id = "selected-data"
          )
        )
      ),

Dash components, by default, expect the children prop to be the first thing passed in. In these cases, you've provided the id first, but have not explicitly set children=, so it doesn't know what to do with that component. Either make them explicitly children, or make them the first thing given to the components.

user_50940440
Related