我正在尝试使一个闪亮的应用程序切换滑块输入的颜色在某些条件下随着更新。下面的例子演示了我正在尝试做的事情的一个不完美的版本。它只有一个滑块输入和两个按钮。这两个按钮使用updateSliderInput
函数来更改滑块的一些属性,然后我使用shinyjs
向滑块添加一个类来改变它的颜色。
ui.R
library(shiny)
library(shinyjs)
shinyUI(fluidPage(
includeCSS('www/style.css'),
useShinyjs(),
sliderInput("slider",
"A slider",
min = 1,
max = 50,
value = 30),
actionButton('type1','type 1'),
actionButton('type2','type 2')
))
。R server.R
library(shiny)
library(shinyjs)
shinyServer(function(input, output,session) {
observeEvent(input$type1,{
updateSliderInput(session,
inputId = 'slider',
min = 0,
value = 10,
max = 20)
delay(3,{
removeClass(selector = '.js-irs-0', class = 'type2')
addClass(selector = '.js-irs-0', class = 'type1')
})
})
observeEvent(input$type2,{
updateSliderInput(session,
inputId = 'slider',
min = 0,
value = 20,
max = 40)
delay(3,{
removeClass(selector = '.js-irs-0', class = 'type1')
addClass(selector = '.js-irs-0', class = 'type2')
})
})
})
(www/css文件在问题的末尾,因为它的内容不太相关)
在快速系统中,结果看起来很好,因为行的执行之间几乎没有延迟。但是,如果我切换到一台速度较慢的机器,当在type1
和type2
提供的颜色之间切换时,您可以看到滑块闪烁回到原来的蓝色。这是因为updateSliderInput
在应用自己的更新时删除了手动添加到滑块中的任何类。我正在寻找一种防止这种情况发生的方法。我怀疑可以使用session$sendCustomMessage
或session$sendInputMessage
来完成,但到目前为止我还没有成功。
注意:delay
函数是必需的,因为如果没有它,updateSliderInput
将覆盖addClass
执行的更改。removeClass
不是必须的,因为updateSliderInput
已经删除了手动添加的类,但我保留了这一行,因为修复可能会阻止updateSliderInput
这样做。
正如承诺的那样:
www/style.css
.type1 .irs-bar {
border-top-color: #8B1A1A;
border-bottom-color: #8B1A1A;
}
.type1 .irs-bar-edge {
border-color: #8B1A1A;
}
.type1 .irs-single, .type1 .irs-bar-edge, .type1 .irs-bar {
background: #8B1A1A;
}
.type2 .irs-bar {
border-top-color: #6959CD;
border-bottom-color: #6959CD;
}
.type2 .irs-bar-edge {
border-color: #6959CD;
}
.type2 .irs-single, .type2 .irs-bar-edge, .type2 .irs-bar {
background: #6959CD;
}
https://stackoverflow.com/questions/50540595
复制相似问题