Могу ли я отправить данные JSON на Mithril маршрут снаружи - PullRequest
Новая
       30

Могу ли я отправить данные JSON на Mithril маршрут снаружи

0 голосов
/ 28 ноября 2018

Например, у меня есть следующие маршруты митрилл. 

m.route.prefix("#");
m.route(document.getElementById('main'), "/", {
"/": {
	render: function() {
		return m('h1','Hello from root');
	}
},
"/trackingController/:numbers": {
	render: function(data) {
		var data = JSON.parse("data");
		// then work with parsed data
		return m('h1', 'Hello from trackingController')
	}
}

Могу ли я отправить данные JSON на маршрут trackingController извне?

1 Ответ

0 голосов
/ 29 ноября 2018

Да, маршруты могут интерполировать параметры.В вашем примере у вас есть параметр :numbers, а ваш код предполагает, что вы ожидаете строку JSON.

Способ, которым Mithril предоставляет данные, передаваемые через сущности, заключается в интерфейсе vnode .attrs собственность.В случае компонентов маршрута и средств разрешения маршрута (как вы используете здесь) attrs - это карта параметров URL .

В этом примере я использую encodeURIComponent разрешить ввод JSON в URL.Я сделал функцию рендеринга, записывающую проанализированные данные, полученные из пути URI, и выставляющую текущий маршрут, а также текстовое поле, где вы можете редактировать структуру JSON и отправлять ее для перенаправления и просмотра новых результатов. 

m.route.prefix("#");
m.route(document.getElementById('main'), "/trackingController/" + encodeURIComponent('[1,2]'), {
  "/trackingController/:numbers": {
    render: function(vnode) {
      console.log(
        'Received the following `numbers`:',
        JSON.parse(vnode.attrs.numbers)
      )

      return [
        m('h1', 'Hello from trackingController'),

        m('p', 'Current route is ',
          m('code', m.route.get())
        ),

        m('form', {
            onsubmit: function(e) {
              e.preventDefault()

              m.route.set(
                "/trackingController/" +
                encodeURIComponent(e.target.elements.input.value)
              )
            }
          },
          m('textarea#input', {
            value: vnode.attrs.numbers,
            style: {
              background: '#444',
              color: '#eee',
              display: 'block',
              padding: '1em',
            },
          }),

          m('button', 'Go!')
        ),
      ]
    }
  }
})
<script src="https://unpkg.com/mithril/mithril.js"></script>
<div id=main></div>
...