想要创建具有相似参数的自定义 numericRangeInput

Question

出于美学原因，我正在制作一个功能与 [shinyWidgets] 相同的自定义 numericRangeInput。1 但是，我无法模仿这个论点。

我想要一个 inputId 用于整个组件，我可以在其中以与 shinyWidget 的输入相同的方式调用值。

这是我目前的情况：

library(tidyverse)

numeric_input_ui <- function(title = "title", text = "to", id = c("id1","id2"), placeholder = c(0,0), value = c(0,0)){
  HTML(
    str_glue(
      '<label>{title}
      <div class="input-group input-group-sm m-4" style="margin:0px!important;margin-top:5px!important;margin-bottom:10px!important;">
  <input class="form-control" type="number" id="{id[1]}" placeholder="{placeholder[1]}" value="{value[1]}">
  <div class="input-group-prepend input-group-append">
    <div class="input-group-text">{text}</div>
  </div>
  <input class="form-control" type="number" id="{id[2]}" placeholder="{placeholder[2]}" value="{value[2]}"></input>
</div>
      </label>'
    )
  )
}

如您所见，我目前使用两个 ID 设置它...这让管理服务器端时很头疼，因为我试图在闪亮的应用程序上实现它。欢迎在我的问题之外对函数本身提出任何建议！

Answer 1

我不太清楚。你为什么不使用你拆分的唯一ID：

numeric_input_ui <- function(
  title = "title", text = "to", id, placeholder = c(0,0), value = c(0,0)
){
  id1 <- paste0(id, "1")
  id2 <- paste0(id, "2")
  HTML(
    str_glue(
      '
<label>
   {title}
   <div class="input-group input-group-sm m-4" style="margin:0px!important;margin-top:5px!important;margin-bottom:10px!important;">
      <input class="form-control" type="number" id="{id1}" placeholder="{placeholder[1]}" value="{value[1]}">
      <div class="input-group-prepend input-group-append">
         <div class="input-group-text">{text}</div>
      </div>
      <input class="form-control" type="number" id="{id2}" placeholder="{placeholder[2]}" value="{value[2]}">
   </div>
</label>
'
    )
  )
}

然后在服务器中使用反应导体返回两个值：

numInput <- reactive({
  c(input[[paste0(id, "1")]], input[[paste0(id, "2")]])
})

这种方式有什么不方便？没有更多上下文，很难找出你的问题。

想要创建具有相似参数的自定义 numericRangeInput

want to create custom numericRangeInput with similar arguments

html

r

bootstrap-4

shiny

shinywidgets