How to reload a widget html after a state update

How to reload the html of a widget when the state gets changed in the below code initially the state is none and after the page gets loaded it gets changed to new state but the html only gets changed when I click on it how to automatically refresh it when the state gets updated

const h = require(“virtual-dom”).h;

api.createWidget(“my-first-widget”, {
tagName: “div.navigationBar”,
buildKey: () => ‘increment-button’,

defaultState() {
  api.onPageChange((url, title) => {
    name="new state"
  })
  return {
    name: "none",
  };
},

html(attrs, state) {
 return h('h1',state.name)

});