R Shiny中sortable排名列表元素克隆功能失效问题求助

问题说明 #

开发的R Shiny应用支持上传CSV文件，基于文件列名创建sortable桶列表，期望将第一个排名列表的列名拖拽至第二个列表时实现克隆效果（原列表元素不被移除），但设置add_rank_list()的options参数中pull='clone'未生效。

解决方法 #

要实现克隆拖拽，需修正两处关键配置：

• 移除bucket_list中的group_name参数：该参数会覆盖子列表的自定义分组配置，导致pull='clone'失效。
• 正确配置两个列表的分组参数：
  • 源列表（第一个列表）：设置pull: "clone"开启克隆拖拽，put: FALSE防止其他元素拖入，分组名称与目标列表一致。
  • 目标列表（第二个列表）：设置put: TRUE允许接收克隆元素，pull: FALSE避免目标元素被拖走，分组名称与源列表保持一致。

修改后的完整代码 #

library(shiny)
library(shinyjs)
library(sortable)

ui <- fluidPage(
  
  titlePanel("App"),
  
  sidebarLayout(
    sidebarPanel(
      useShinyjs(),
      fileInput(inputId = "file1", label = "Select a .csv file", 
                accept = c("text/csv", "text/comma-separated-values,text/plain", ".csv")
      ),
      uiOutput("show_button")
    ),
    
    mainPanel(
      DT::dataTableOutput("table")
    )
  ),
  
  fluidRow(uiOutput("buckets"))
  
)

server <- function(input, output) {
  
  # 读取上传的CSV文件
  input_file <- reactive({
    if (is.null(input$file1)) {
      return("")
    }
    read.csv(file = input$file1$datapath)
  })
  
  # 生成显示/隐藏表格的按钮
  output$show_button = renderUI({
    req(input$file1)
    actionButton(inputId = "button", label = "show / hide table")
  })
  
  # 监听按钮点击，切换表格显示状态
  observeEvent(input$button, {
    shinyjs::toggle("table")
  })
  
  # 渲染数据表格
  output$table <- DT::renderDataTable({
    req(input_file())
    data <- input_file()
    data
  })
  
  # 生成拖拽排序的桶列表
  output$buckets = renderUI( 
    {
      req(input$file1)
      data = input_file()
      cols = colnames(data)
      
      bucket_list(
        header = "Drag the items in any desired bucket",
        orientation = "horizontal",
        
        add_rank_list(
          text = "Drag from here",
          labels = as.list(cols),
          input_id = "rank_list_1",
          css_id = "list1", 
          options = sortable_options(
            group = list(
              pull = "clone",
              name = "list_group1",
              put = FALSE
            )
          )
        ),
        
        add_rank_list(
          text = "to here",
          labels = NULL,
          input_id = "rank_list_2",
          css_id = "list2", 
          options = sortable_options(
            group = list(
              name = "list_group1",
              put = TRUE,
              pull = FALSE
            )
          )
        )
      )
      
    })
  
}

# 运行应用
shinyApp(ui = ui, server = server)

效果验证 #

上传CSV文件后，拖拽第一个列表中的列名到第二个列表时，原列表元素会保留，同时第二个列表会新增克隆的元素，实现预期的克隆拖拽效果。

内容的提问来源于stack exchange，提问作者Oliver Oliver