You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Shiny sortable包实现rank_list项可重复拖拽至其他排序列表

实现方案

你需要的类Excel数据透视表字段拖拽效果(源列表选项固定不消失、同一选项可重复拖拽到目标区域),可以直接通过rank_list的options参数配置实现,不需要额外写复杂的JS交互。

核心配置逻辑是给作为字段源的rank_list传入SortableJS原生规则:

  • pull = "clone":拖拽选项时生成副本,原选项保留在源列表不移动
  • put = FALSE:禁止其他列表的选项拖入源列表,避免源列表内容被污染

修改后的可运行代码如下:

library(shiny)
library(sortable)


ui <- fluidPage(
  tags$head(
    tags$style(HTML(".bucket-list-container {min-height: 350px;}"))
  ),
  fluidRow(
    column(
      tags$b("Exercise"),
      width = 12,
      bucket_list(
        header = "Drag the items in any desired bucket",
        group_name = "bucket_list_group",
        orientation = "horizontal",
        add_rank_list(
          text = "Drag from here",
          labels = list(
            "a", "b", "c"
          ),
          input_id = "rank_list_1",
          # 新增核心配置
          options = sortable_options(
            pull = "clone",
            put = FALSE
          )
        ),
        add_rank_list(
          text = "to here",
          labels = NULL,
          input_id = "rank_list_2"
        )
      )
    )
  ),
  fluidRow(
    column(
      width = 12,
      tags$b("Result"),
      column(
        width = 12,
        
        tags$p("input$rank_list_1"),
        verbatimTextOutput("results_1"),
        
        tags$p("input$rank_list_2"),
        verbatimTextOutput("results_2"),
        
        tags$p("input$bucket_list_group"),
        verbatimTextOutput("results_3")
      )
    )
  )
)

server <- function(input,output) {
  output$results_1 <-
    renderPrint(
      input$rank_list_1
    )
  output$results_2 <-
    renderPrint(
      input$rank_list_2
    )
  output$results_3 <-
    renderPrint(
      input$bucket_list_group
    )
}


shinyApp(ui, server)

运行后交互效果完全匹配需求:

  • 左侧源列表的a/b/c三个选项始终固定存在,不会因拖拽消失
  • 同一选项可以反复拖拽到右侧目标列表,支持重复添加
  • 右侧列表内的选项可以自由排序,也支持移出删除
  • 右侧选项无法拖回左侧源列表,保证源列表始终为初始字段集合

如果需要扩展多目标区域(比如透视表的行、列、值、筛选四个区域),只需要在同一个bucket_list下新增对应的rank_list即可,源列表的复制拖拽规则对所有同组目标列表生效。


内容的提问来源于stack exchange,提问作者Alejo

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.09.03 06:12:39