获取发出的数据后，有没有办法存储发出的数据？

Question

我正在使用EventBus。我的代码如下。

app.js

EventBus.$emit('emitted', {
    SomeProperty: SomeData,
});

以下是Emit

的代码

EventBus.$on('emitted', id => {

});

以下是检索已发布数据的代码

library(shinydashboard)
library(shiny)

Logged = FALSE
my_username <- c("test", "test2")
my_password <- c("test", "test2")
my_role <- c("Admin", "Guest")

Login_side <- function(){
  sidebarMenu(id = "tabs")
}
Login_page <- function(){
  tagList(
    div(id = "login",
        fluidRow(br()),
        fluidRow(br()),
        fluidRow(br()),
        fluidRow(br()),
        fluidRow(br()),
        fluidRow(br()),
        fluidRow(br()),
        fluidRow(br()),
        fluidRow(
          column(4, offset = 4, uiOutput("Login_full_box"))
        )
    )
  )
}

Admin_side <- function(){
  sidebarMenu(id = "sbMenu",
              menuItem("test menu", tabName = "test", icon = icon("th"))
  )
}
Admin_page <- function(){
  tabItems(tabItem(tabName = "test", h2("HELLO")))
}

Guest_side <- function(){
  sidebarMenu(id = "sbMenu",
              menuItem("test menu 2", tabName = "test2", icon = icon("th"))
  )
}
Guest_page <- function(){
  tabItems(tabItem(tabName = "test2", h2("HELLO 2")))
}    


ui <- shinyUI( 
  dashboardPage(
    dashboardHeader(title =  "Dashboard", titleWidth = 190),
    dashboardSidebar(width = 190, uiOutput("side")),
    dashboardBody(height=1000, uiOutput("page"))
  )
)

server <- function(input, output) {
  USER <- reactiveValues(Logged = FALSE)

  observe({
    if (USER$Logged == FALSE){
      if(!is.null(input$Login)){
        if(input$Login > 0){
          Username <- isolate(input$username)
          Password <- isolate(input$password)
          if(length(Username) > 0 && length(Password) > 0){
            if(my_password[which(my_username==Username)]==Password){
              USER$Logged <- TRUE
              USER$role <- my_role[which(my_username==Username)]
            }
            else {
              USER$Logged <- FALSE
            }
          }
          else {
            USER$Logged <- FALSE
          }
        }
      }
    }
  })

  observe({
    if(USER$Logged == FALSE) {
      output$side <- renderUI({Login_side()})
      output$page <- renderUI({Login_page()})     
    }
    if((USER$Logged == TRUE)){
      if(USER$role == "Admin"){
        output$side <- renderUI({Admin_side()})
        output$page <- renderUI({Admin_page()})
      }
      if(USER$role == "Guest"){
        output$side <- renderUI({Guest_side()})
        output$page <- renderUI({Guest_page()})
      }
    }
  })

  output$Login_full_box <- renderUI({
    box(title =  "Login Panel", 
        width = 12, 
        status = "info",  
        solidHeader = TRUE,
        fluidRow(
          column(3, "Username:"),
          column(9, textInput("username", label = NULL))
        ),   
        fluidRow(
          column(3, "Password:"),
          column(9, passwordInput("password", label = NULL))
        ),         
        fluidRow(
          column(5, offset = 3, actionButton("Login", "Login"))
        )
    )
  })
}
shinyApp(ui = ui, server = server)

一旦获取发出的数据，有没有办法存储发出的数据？我试图搜索是否有任何方法可以将发出的数据保存在某个地方？

Answer 1

要保存数据并在组件之间共享，请使用vuex

要在localstorage中保存数据，为方便起见，您可以使用vue-ls

Answer 2

因为你在Laravel中使用了Vue：

    // Your event bus
    const EventBus = new Vue()

    // The main Vue instance for your app
    const app = new Vue({
        // ALL YOUR APP LOGIC GOES HERE...

      methods: {
        fetchData (params) {
          // this is the method you use to fetch data, here you can use a library
          // like axios to query your api and return the result
                return axios.get('/api/someData', { params })
        }
      },
      // Every time your app is loaded, it executes the created() hook to retrieve
      // previously stored data from localStorage.
      // Depending on your needs, you can use mounted() hook instead.
      created () {
        // Attach the listener to store someData in localStorage
        EventBus.$on('someData', data => window.localStorage.setItem('someData', data))

        // check for stored someData
        const someData = window.localStorage.getItem('someData')

        if (someData) {
            // do something with someData
        }
        else {
            // there is no someData stored, so fetch and store ($emit)
            this.fetchData()
            .then(response => {
              if (response.data.someData) {
                EventBus.$emit('someData', response.data.someData)
              }
            })
        }
      }
    })

Answer 3

到目前为止，我发现了以下方法。

获取已保存的数据。

localStorage.getItem("Key")

保存数据

localStorage.setItem("Key")