Как сохранить статус в mirthril.js в localStorage? - PullRequest
Новая
       11

Как сохранить статус в mirthril.js в localStorage?

1 голос
/ 15 мая 2019

Я пытаюсь сохранить статус флажка в localStorage, вот код с mithril 2.0, но он не будет перерисовывать флажок после oninit (). 

<!doctype html><head>                                                           
<meta name="viewport" content="width=device-width, initial-scale=1.0">          
<script src="//unpkg.com/mithril@next/mithril.min.js"></script>                 
</head>                                                                         
<body>                                                                          
<script>                                                                        
var state = false                                                               
var ConfigPage = {                                                              
  view: function(vnode) {                                                       
    return m('input[type=checkbox]', {                                          
      value: state,                                                             
      onchange: function(e) {                                                   
        state = (e.target.value !== 'true')                                     
        if (localStorage !== undefined) {                                       
          var s = JSON.stringify(state)                                         
          console.log("save state in t1:", s)                                   
          localStorage.setItem('t1', s)                                         
        }                                                                       
      }                                                                         
    })                                                                          
  }                                                                             
}                                                                               
m.mount(document.body, {                                                        
  oninit: function(vnode) {                                                     
    if (localStorage !== undefined) {                                           
      var v = localStorage.getItem("t1")                                        
      if (v !== null) {                                                         
        state = JSON.parse(v)                                                   
        console.log("load state from t1:", v)                                   
      }                                                                                                                                                                                                                                           
    }                                                                           
  },                                                                            
  view: function() {                                                            
    return m(ConfigPage)                                                        
  }                                                                             
})                                                                              
</script>                                                                       
</body></html>

Ответы [ 2 ]

1 голос
/ 15 мая 2019

Эта проблема вызвана неправильной установкой проверенного атрибута, вот исправленный код 

<!doctype html><head>                                                           
<meta name="viewport" content="width=device-width, initial-scale=1.0">          
<script src="//unpkg.com/mithril@next/mithril.min.js"></script>                 
</head>                                                                         
<body>                                                                          
<script>                                                                        
var state = false                                                               
var ConfigPage = {                                                              
  view: function(vnode) {                                                       
    return m('input[type=checkbox]', {                                          
      value: state,              
      checked: state,  // ADD THIS                                               
      onchange: function(e) {                                                   
        state = e.target.checked  // use the checked value
        if (localStorage !== undefined) {                                       
          var s = JSON.stringify(state)                                         
          console.log("save state in t1:", s)                                   
          localStorage.setItem('t1', s)                                         
        }                                                                       
      }                                                                         
    })                                                                          
  }                                                                             
}                                                                               
m.mount(document.body, {                                                        
  oninit: function(vnode) {                                                     
    if (localStorage !== undefined) {                                           
      var v = localStorage.getItem("t1")                                        
      if (v !== null) {                                                         
        state = JSON.parse(v)                                                   
        console.log("load state from t1:", v)                                   
      }                                                                                                                                                                                                                                           
    }                                                                           
  },                                                                            
  view: function() {                                                            
    return m(ConfigPage)                                                        
  }                                                                             
})                                                                              
</script>                                                                       
</body></html>
0 голосов
/ 15 мая 2019 

var localstorage = mx.storage('localstorage', mx.LOCAL_STORAGE);

localstorage.set( 'jsonObject' , {} );
<script src="https://unpkg.com/mithril@2.0.0-rc.4/mithril.min.js"></script>
<script src="http://kawan16.github.io/mithril-storage/lib/mithril-storage.js"></script>
...