希望使用类似的参数创建自定义numericRangeInput

Question

出于美观的原因，我正在制作一个自定义的numericRangeInput，其功能与[shinyWidgets]中的相同然而，我很难模仿这一论点。

我希望整个组件都有一个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")]])
})

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