Átállás v0.2.x verzióról

Az 1.x és 2.x verziók nagymértékben API-kompatibilisek a v0.2.x verzióval, de van néhány nem kompatibilis változás. A 2.x verzióra való migrálás szinte azonos, így az alábbi megjegyzések leginkább mindkettőre vonatkoznak.

Ha átállást végez, fontolja meg a mithril-codemods eszköz használatát, amely segíthet automatizálni a legegyszerűbb átállásokat.

`m.prop` eltávolítva

A 2.x verzióban az m.prop() egy erősebb stream könyvtárrá alakult, de már nem része az alaprendszernek. Az opcionális Streams modul használatáról a dokumentációban olvashat.

v0.2.x

javascript

var m = require('mithril');

var num = m.prop(1);

v2.x

javascript

var m = require('mithril');
var prop = require('mithril/stream');

var num = prop(1);
var doubled = num.map(function (n) {
  return n * 2;
});

`m.component` eltávolítva

A v0.2.x verzióban a komponensek létrehozhatók m(Component) vagy m.component(Component) használatával. A 2.x verzió csak az m(Component)-et támogatja.

v0.2.x

javascript

// Ezek egyenértékűek
m.component(Component);
m(Component);

v2.x

javascript

m(Component);

`m.withAttr` eltávolítva

A v0.2.x verzióban az eseményfigyelők használhatták az oninput: m.withAttr("value", func) és hasonlókat. A 2.x verzióban egyszerűen közvetlenül kiolvashatjuk az értékeket az esemény célpontjából. Jól működött együtt az m.prop-pal, de mivel ezt egy külső megoldás javára törölték, és az 1.x verzióban nem volt hasonlóan széles körben elterjedt a stream használata, az m.withAttr elvesztette hasznosságának nagy részét.

v0.2.x

javascript

var value = m.prop('');

// A nézetben
m('input[type=text]', {
  value: value(),
  oninput: m.withAttr('value', value),
});

v2.x

javascript

var value = '';

// A nézetben
m('input[type=text]', {
  value: value,
  oninput: function (ev) {
    value = ev.target.value;
  },
});

`m.version` eltávolítva

Általában kevés haszna volt, és bármikor visszaadhatta volna azt saját maga. Előnyben kell részesíteni a funkciófelismerést annak megállapításához, hogy mely funkciók érhetők el, és a 2.x API-t úgy tervezték, hogy ezt jobban lehetővé tegye.

`config` függvény

A v0.2.x verzióban a Mithril.js egyetlen életciklus metódust biztosított, a config-ot. A 2.x verzió sokkal részletesebb irányítást biztosít egy vnode életciklusa felett.

v0.2.x

javascript

m('div', {
  config: function (element, isInitialized) {
    // minden újrarajzoláskor fut
    // az isInitialized egy boolean érték, amely azt jelzi, hogy a csomópont hozzá lett-e adva a DOM-hoz
  },
});

v2.x

További dokumentáció ezekről az új metódusokról a lifecycle-methods.md fájlban található.

javascript

m('div', {
  // Meghívódik a DOM csomópont létrehozása előtt
  oninit: function (vnode) {
    /*...*/
  },
  // Meghívódik a DOM csomópont létrehozása után
  oncreate: function (vnode) {
    /*...*/
  },
  // Meghívódik a csomópont frissítése előtt, false értékkel visszatérve megszakítható
  onbeforeupdate: function (vnode, old) {
    /*...*/
  },
  // Meghívódik a csomópont frissítése után
  onupdate: function (vnode) {
    /*...*/
  },
  // Meghívódik a csomópont eltávolítása előtt, egy Promise-t ad vissza, amely akkor oldódik fel, amikor
  // készen áll a csomópont eltávolítására a DOM-ból
  onbeforeremove: function (vnode) {
    /*...*/
  },
  // Meghívódik a csomópont eltávolítása után, de az onbeforeremove done() hívása után
  onremove: function (vnode) {
    /*...*/
  },
});

Ha elérhető, a vnode DOM-Elementje a vnode.dom címen érhető el.

Változások az újrarajzolási viselkedésben

A Mithril.js renderelő motorja továbbra is félig automatizált globális újrarajzolások alapján működik, azonban néhány API és viselkedés eltér:

Nincsenek többé újrarajzolási zárak

A v0.2.x verzióban a Mithril.js lehetővé tette az "újrarajzolási zárakat", amelyek ideiglenesen megakadályozták a blokkolt rajzolási logikát: alapértelmezés szerint az m.request zárolta a rajzolási ciklust a végrehajtáskor, és feloldotta, amikor az összes függőben lévő kérés feloldódott - ugyanez a viselkedés manuálisan is meghívható az m.startComputation() és az m.endComputation() használatával. Az utóbbi API-k és a hozzájuk tartozó viselkedés eltávolításra került a 2.x verzióban, csere nélkül. Az újrarajzolási zárolás hibás felhasználói felületekhez vezethet: az alkalmazás egyik részének problémái nem szabad, hogy megakadályozzák a nézet más részeinek frissítését, ezzel tükrözve a változást.

Újrarajzolás megszakítása eseménykezelőkből

Az m.mount() és az m.route() továbbra is automatikusan újrarajzol egy DOM eseménykezelő futtatása után. Ezeknek az újrarajzolásoknak a megszakítása az eseménykezelőkből most úgy történik, hogy az átadott eseményobjektum redraw tulajdonságát false értékre állítjuk.

v0.2.x

javascript

m('div', {
  onclick: function (e) {
    m.redraw.strategy('none');
  },
});

v2.x

javascript

m('div', {
  onclick: function (e) {
    e.redraw = false;
  },
});

Szinkron újrarajzolás megváltozott

A v0.2.x verzióban lehetőség volt a Mithril.js azonnali újrarajzolására kényszeríteni egy igaz értéket átadva az m.redraw()-nak. A 2.x verzióban ezt a funkcionalitást a nagyobb tisztaság érdekében két különböző metódusra osztották.

v0.2.x

javascript

m.redraw(true); // azonnal és szinkron módon újrarajzol

v2.x

javascript

m.redraw(); // ütemezi az újrarajzolást a következő requestAnimationFrame tick-re
m.redraw.sync(); // azonnal meghívja az újrarajzolást, és megvárja, amíg befejeződik

`m.startComputation`/`m.endComputation` eltávolítva

Antimintáknak tekintik őket, és számos problémás határhelyzetük van, ezért csere nélkül eltávolították őket a 2.x verzióban.

Komponens `controller` függvény

A 2.x verzióban megszűnt a controller tulajdonság a komponensekben - használja helyette az oninit-et.

v0.2.x

javascript

m.mount(document.body, {
  controller: function () {
    var ctrl = this;

    ctrl.fooga = 1;
  },

  view: function (ctrl) {
    return m('p', ctrl.fooga);
  },
});

v2.x

javascript

m.mount(document.body, {
  oninit: function (vnode) {
    vnode.state.fooga = 1;
  },

  view: function (vnode) {
    return m('p', vnode.state.fooga);
  },
});

// VAGY

m.mount(document.body, {
  // ez alapértelmezés szerint a vnode.state-hez van kötve
  oninit: function (vnode) {
    this.fooga = 1;
  },

  view: function (vnode) {
    return m('p', this.fooga);
  },
});

Komponens argumentumok

A 2.x verzióban egy komponens argumentumainak objektumnak kell lenniük, az egyszerű értékek, mint a String/Number/Boolean, szöveges gyermekekként lesznek kezelve. Az argumentumok a komponensen belül a vnode.attrs objektumból nyerhetők ki.

v0.2.x

javascript

var Component = {
  controller: function (options) {
    // options.fooga === 1
  },

  view: function (ctrl, options) {
    // options.fooga === 1
  },
};

m('div', m.component(Component, { fooga: 1 }));

v2.x

javascript

var Component = {
  oninit: function (vnode) {
    // vnode.attrs.fooga === 1
  },

  view: function (vnode) {
    // vnode.attrs.fooga === 1
  },
};

m('div', m(Component, { fooga: 1 }));

Komponens vnode gyermekek

A v0.2.x verzióban a komponens vnode gyermekei nem voltak normalizálva, csak extra argumentumként adták át őket, és nem is voltak lapítva. (Belsőleg ez csak egy részlegesen alkalmazott komponens visszaadása volt, amelyet a komponens részleges alkalmazása alapján diffeltek.) A 2.x verzióban a komponens vnode gyermekei a vnode.children-en keresztül kerülnek átadásra a gyermekek feldolgozott tömbjeként, de a v0.2.x verzióhoz hasonlóan maguk az egyes gyermekek sem normalizáltak, és a gyermek tömb sem lapított.

v0.2.x

javascript

var Component = {
  controller: function (value, renderProp) {
    // value === "value"
    // typeof renderProp === "function"
  },

  view: function (ctrl, value, renderProp) {
    // value === "value"
    // typeof renderProp === "function"
  },
};

m(
  'div',
  m.component(Component, 'value', function (key) {
    return 'child';
  })
);

v2.x

javascript

var Component = {
  oninit: function (vnode) {
    // vnode.children[0] === "value"
    // typeof vnode.children[1] === "function"
  },

  view: function (vnode) {
    // vnode.children[0] === "value"
    // typeof vnode.children[1] === "function"
  },
};

m(
  'div',
  m(Component, 'value', function (key) {
    return 'child';
  })
);

DOM vnode gyermekek

A v0.2.x verzióban a DOM csomópontok gyermekei szó szerint lettek ábrázolva, normalizálás nélkül, azzal a kivétellel, ha csak egyetlen tömb gyermek volt jelen, mert akkor közvetlenül azt használták. Egy ehhez hasonló struktúrát adott vissza, a karakterláncokat szó szerint ábrázolva.

javascript

m("div", "value", ["nested"])

// Ebből lesz:
{
	tag: "div",
	attrs: {},
	children: [
		"value",
		["nested"],
	]
}

A 2.x verzióban a DOM vnode-ok gyermekei egyetlen konzisztens struktúra objektumaivá vannak normalizálva.

javascript

m("div", "value", ["nested"])

// Ebből lesz nagyjából:
{
	tag: "div",
	attrs: null,
	children: [
		{tag: "#", children: "value"},
		{tag: "[", children: [
			{tag: "#", children: "nested"},
		]},
	]
}

Ha csak egyetlen szöveges gyermek van jelen egy DOM vnode-on, akkor ehelyett a text értékét erre az értékre állítja.

javascript

m("div", "value")

// Ebből lesz nagyjából:
{
	tag: "div",
	attrs: null,
	text: "",
	children: undefined,
}

A v2.x vnode struktúrával és a dolgok normalizálásával kapcsolatos további részletekért lásd a vnode dokumentációt.

A v2.x vnode tulajdonságainak többsége itt a rövidség kedvéért el van hagyva.

Kulcsok

A v0.2.x verzióban szabadon keverhette a kulcsolt és a kulcsolatlan vnode-okat.

A 2.x verzióban a fragmentumok és az elemek gyermeklistáinak vagy mind kulcsoltaknak, vagy mind kulcsolatlanoknak kell lenniük. A lyukak is kulcsolatlanoknak minősülnek ezen ellenőrzés céljából - már nem hagyja figyelmen kívül őket.

Ha meg kell oldania, használja egyetlen vnode-ot tartalmazó fragmentum idiómáját, például [m("div", {key: whatever})].

`view()` paraméterek

A v0.2.x verzióban a view függvények a controller példányra mutató hivatkozást és (opcionálisan) a komponensnek átadott beállításokat kapják meg. A 2.x verzióban kizárólag a vnode-ot kapják meg, pontosan úgy, mint a controller függvény.

v0.2.x

javascript

m.mount(document.body, {
  controller: function () {},

  view: function (ctrl, options) {
    // ...
  },
});

v2.x

javascript

m.mount(document.body, {
  oninit: function (vnode) {
    // ...
  },

  view: function (vnode) {
    // Használja a vnode.state-et a ctrl helyett
    // Használja a vnode.attrs-t az options helyett
  },
});

Komponensek átadása az `m()`-nek

A v0.2.x verzióban a komponenseket a m() második argumentumaként adhatta át, mindenféle burkolás nélkül. A konzisztencia érdekében a 2.x verzióban mindig be kell burkolni őket egy m() hívással.

v0.2.x

javascript

m('div', Component);

v2.x

javascript

m('div', m(Component));

Vnode-ok átadása az `m.mount()` és az `m.route()`-nak

A v0.2.x verzióban az m.mount(element, component) tolerálta a vnode-okat második argumentumként a komponensek helyett (bár nem volt dokumentálva). Hasonlóképpen, az m.route(element, defaultRoute, routes) elfogadta a vnode-okat értékként a routes objektumban.

A 2.x verzióban mindkét esetben ehelyett komponensek szükségesek.

v0.2.x

javascript

m.mount(element, m('i', 'hello'));
m.mount(element, m(Component, attrs));

m.route(element, '/', {
  '/': m('b', 'bye'),
});

v2.x

javascript

m.mount(element, {
  view: function () {
    return m('i', 'hello');
  },
});
m.mount(element, {
  view: function () {
    return m(Component, attrs);
  },
});

m.route(element, '/', {
  '/': {
    view: function () {
      return m('b', 'bye');
    },
  },
});

`m.route.mode`

A v0.2.x verzióban az útválasztási módot az m.route.mode változóhoz rendelt "pathname", "hash" vagy "search" string értékkel lehetett beállítani. A v1.x verzióban ezt a m.route.prefix = prefix váltotta ki, ahol a prefix bármilyen előtag lehet. Ha #-el kezdődik, akkor "hash" módban működik, ? esetén "search" módban, és bármilyen más karakter (vagy az üres string) esetén "pathname" módban. Támogatja a fenti kombinációit is, mint például m.route.prefix = "/path/#!" vagy ?#.

Az alapértelmezett érték megváltozott, és most már #! (hashbang) előtagot használ a # helyett. Tehát, ha az alapértelmezett viselkedést használta, és meg szeretné tartani a meglévő URL-jeit, állítsa be a m.route.prefix = "#" értéket az útvonalak inicializálása előtt.

v0.2.x

javascript

m.route.mode = 'hash';
m.route.mode = 'pathname';
m.route.mode = 'search';

v2.x

javascript

// Közvetlen megfelelői
m.route.prefix = '#';
m.route.prefix = '';
m.route.prefix = '?';

`m.route()` és anchor tagek

Az útvonalazható linkek kezelésére most egy speciális, beépített komponens szolgál attribútum helyett. Ha ezt <button>-öknél és hasonlóknál használta, megadhatja a tag nevét egy selector: "button" attribútummal.

v0.2.x

javascript

// Erre a linkre kattintva a "/path" útvonal töltődik be a navigálás helyett
m('a', {
  href: '/path',
  config: m.route,
});

v2.x

javascript

// Erre a linkre kattintva a "/path" útvonal töltődik be a navigálás helyett
m(m.route.Link, {
  href: '/path',
});

Útvonal sablonok

Az 1.x verzióban három különálló útvonal sablon szintaxis létezett, amelyek bár hasonlóak voltak, 2 külön tervezett szintaxissal és 3 különböző implementációval rendelkeztek. Ez viszonylag ad hoc módon lett definiálva, és a paraméterek általában nem voltak megfelelően kódolva. Most minden kódolva van, ha :key szerepel az útvonalban, és nyers marad, ha :key... szerepel. Ha valami váratlanul kódolva van, használja a :path... formátumot. Ennyire egyszerű.

Konkrétan, így érinti az egyes metódusokat:

`m.request` URL-ek

A 2.x verzióban az útvonal komponensek automatikusan kódolva vannak, amikor interpolálva vannak, és az értékeiket a params objektumból olvassák. A 0.2.x verzióban az m.request({url: "/user/:name/photos/:id", data: {name: "a/b", id: "c/d"}}) a kérést a /user/a%2Fb/photos/c/d URL-lel küldte volna el. A 2.x verzióban a megfelelő m.request({url: "/user/:name/photos/:id", params: {name: "a/b", id: "c/d"}}) a kérést a /user/a%2Fb/photos/c%2Fd címre küldené. Ha szándékosan szeretné, hogy egy kulcs kódolás nélkül legyen interpolálva, használja a :key... formátumot helyette.

A beágyazott lekérdezőszövegekben, mint például a /api/search?q=:query, az interpolációk a 2.x verzióban nem történnek meg. Adja át ezeket a params objektumban a megfelelő kulcsnevekkel, anélkül, hogy a lekérdezőszövegben megadná őket.

Ne feledje, hogy ez a m.jsonp-re is vonatkozik. Amikor a m.request + dataType: "jsonp"-ről a m.jsonp-re migrál, ezt is figyelembe kell vennie.

`m.route(route, params, shouldReplaceHistoryEntry)` útvonalak

Ezek most lehetővé teszik az interpolációt, és ugyanúgy működnek, mint a m.request esetében.

`m.route` útvonal minták

A :key... formátumú útvonal kulcsok az 1.x verzióban URL-dekódolva tértek vissza, de a 2.x verzióban a nyers URL-t adják vissza.

Korábban az olyan formátumok, mint a :key.md tévesen elfogadásra kerültek, és az eredményül kapott paraméter értéke keymd: "..." lett. Ez már nem így van - a .md most a minta része, nem a név.

Az aktuális útvonal olvasása/írása

A 0.2.x verzióban az aktuális útvonallal kapcsolatos minden interakció a m.route() függvényen keresztül történt. A 2.x verzióban ez két függvényre lett bontva.

v0.2.x

javascript

// Az aktuális útvonal lekérdezése
m.route();

// Új útvonal beállítása
m.route('/other/route');

v2.x

javascript

// Az aktuális útvonal lekérdezése
m.route.get();

// Új útvonal beállítása
m.route.set('/other/route');

Útvonal paraméterek elérése

A 0.2.x verzióban az útvonal paraméterek olvasása teljes mértékben a m.route.param()-on keresztül történt. Ez az API továbbra is elérhető a 2.x verzióban, és emellett minden útvonal paraméter tulajdonságként kerül átadásra a vnode attrs objektumában.

v0.2.x

javascript

m.route(document.body, '/booga', {
  '/:attr': {
    controller: function () {
      m.route.param('attr'); // "booga"
    },
    view: function () {
      m.route.param('attr'); // "booga"
    },
  },
});

v2.x

javascript

m.route(document.body, '/booga', {
  '/:attr': {
    oninit: function (vnode) {
      vnode.attrs.attr; // "booga"
      m.route.param('attr'); // "booga"
    },
    view: function (vnode) {
      vnode.attrs.attr; // "booga"
      m.route.param('attr'); // "booga"
    },
  },
});

Lekérdezőszövegek építése/elemzése

A 0.2.x verzió a m.route objektum m.route.buildQueryString() és m.route.parseQueryString() metódusait használta. A 2.x verzióban ezek ki lettek bontva és a gyökérszintű m objektumba lettek áthelyezve.

v0.2.x

javascript

var qs = m.route.buildQueryString({ a: 1 });

var obj = m.route.parseQueryString('a=1');

v2.x

javascript

var qs = m.buildQueryString({ a: 1 });

var obj = m.parseQueryString('a=1');

Továbbá, a 2.x verzióban a {key: undefined} objektum key=undefined formában van szerializálva a m.buildQueryString függvény és az azt használó metódusok, például a m.request által. A 0.2.x verzióban a kulcs el lett hagyva, és ez átkerült a m.request-be. Ha korábban erre támaszkodott, módosítsa a kódot, hogy teljesen elhagyja a kulcsokat az objektumból. Érdemes lehet egy egyszerű segédfüggvényt használni az összes kulcs eltávolításához egy objektumból, amelynek értékei undefined, ha ezt nem tudja könnyen megtenni, és meg kell őriznie a 0.2.x viselkedést.

javascript

// Hívja meg, amikor el kell hagynia az `undefined` paramétereket egy objektumból.
function omitUndefineds(object) {
  var result = {};

  for (var key in object) {
    if ({}.hasOwnProperty.call(object, key)) {
      var value = object[key];
      if (Array.isArray(value)) {
        result[key] = value.map(omitUndefineds);
      } else if (value != null && typeof value === 'object') {
        result[key] = omitUndefineds(value);
      } else if (value !== undefined) {
        result[key] = value;
      }
    }
  }

  return result;
}

Az unmounting megakadályozása

Már nem lehet megakadályozni a komponens eltávolítását az onunload eseménykezelőben az e.preventDefault() meghívásával. Ehelyett explicit módon kell meghívni a m.route.set függvényt, amikor a várt feltételek teljesülnek.

v0.2.x

javascript

var Component = {
  controller: function () {
    this.onunload = function (e) {
      if (condition) e.preventDefault();
    };
  },
  view: function () {
    return m('a[href=/]', { config: m.route });
  },
};

v2.x

javascript

var Component = {
  view: function () {
    return m('a', {
      onclick: function () {
        if (!condition) m.route.set('/');
      },
    });
  },
};

Kód futtatása a komponens eltávolításakor

A komponensek már nem hívják meg a this.onunload metódust, amikor eltávolításra kerülnek. Most a szabványosított onremove életciklus-horgot használják.

v0.2.x

javascript

var Component = {
  controller: function () {
    this.onunload = function (e) {
      // ...
    };
  },
  view: function () {
    // ...
  },
};

v2.x

javascript

var Component = {
	onremove: function() {
		// ...
	}
	view: function() {
		// ...
	}
}

`m.request`

A m.request által visszaadott Promise objektumok már nem m.prop getter-setterek. Ezenkívül az initialValue, unwrapSuccess és unwrapError opciók már nem támogatottak.

Ezenkívül a kérésekhez már nem tartozik m.startComputation/m.endComputation szemantika. Ehelyett az újrarajzolások mindig aktiválódnak, amikor egy kérés Promise lánc befejeződik (kivéve, ha a background: true be van állítva).

A data paraméter most fel lett osztva params objektumra (a URL-be interpolált és a kéréshez hozzáfűzött query paraméterek), és body objektumra (az alapul szolgáló XHR-ben elküldendő body).

A 0.2.x verzióban a dataType: "jsonp" beállítás használatával lehetett JSONP kérést kezdeményezni. A 2.x verzióban most a m.jsonp függvényt használja, amely nagyrészt ugyanazt az API-t kínálja, mint a m.request az XHR-rel kapcsolatos részek nélkül.

v0.2.x

javascript

var data = m.request({
  method: 'GET',
  url: 'https://api.github.com/',
  initialValue: [],
});

setTimeout(function () {
  console.log(data());
}, 1000);

m.request({
  method: 'POST',
  url: 'https://api.github.com/',
  data: someJson,
});

v2.x

javascript

var data = [];
m.request({
  method: 'GET',
  url: 'https://api.github.com/',
}).then(function (responseBody) {
  data = responseBody;
});

setTimeout(function () {
  console.log(data); // megjegyzés: nem getter-setter
}, 1000);

m.request({
  method: 'POST',
  url: 'https://api.github.com/',
  body: someJson,
});

// VAGY

var data = [];
m.request('https://api.github.com/').then(function (responseBody) {
  data = responseBody;
});

setTimeout(function () {
  console.log(data); // megjegyzés: nem getter-setter
}, 1000);

m.request('https://api.github.com/', {
  method: 'POST',
  body: someJson,
});

Ezenkívül, ha az extract opció átadásra kerül a m.request függvénynek, a megadott függvény visszatérési értéke közvetlenül a kérés Promise objektumának feloldására lesz használva, és a deserialize callback figyelmen kívül lesz hagyva.

`m.request` fejlécek

A 0.2.x verzióban a Mithril.js alapértelmezés szerint nem állított be fejléceket a kérésekben. Most legfeljebb 2 fejléceket állít be:

Content-Type: application/json; charset=utf-8 a JSON body-val rendelkező kérésekhez, amelyek != null
Accept: application/json, text/* a JSON válaszokat váró kérésekhez

A két fejléc közül az első, a Content-Type, CORS preflight kérést fog kiváltani, mivel nem CORS-safelisted kérés fejléc a megadott tartalomtípus miatt, és ez új hibákat okozhat attól függően, hogy a CORS hogyan van konfigurálva a szerveren. Ha problémákba ütközik ezzel, előfordulhat, hogy felül kell bírálnia a szóban forgó fejlécet a headers: {"Content-Type": "text/plain"} átadásával. (Az Accept fejléc nem vált ki semmit, ezért nem kell felülbírálnia.)

Az egyetlen tartalomtípus, amely lehetővé teszi a Fetch specifikáció számára a CORS prefetch ellenőrzések elkerülését, az az application/x-www-form-urlencoded, a multipart/form-data és a text/plain. Semmi mást nem engedélyez, és szándékosan tiltja a JSON-t.

`m.deferred` eltávolítva

A 0.2.x verzió a saját egyéni aszinkron szerződés objektumát használta, amelyet m.deferred néven tett közzé, és amelyet a m.request alapjául szolgált. A 2.x verzió ehelyett Promise objektumokat használ, és egy polyfill-t implementál a nem támogató környezetekben. Azokban a helyzetekben, ahol a m.deferred objektumot használta volna, ehelyett Promise objektumokat kell használnia.

v0.2.x

javascript

var greetAsync = function () {
  var deferred = m.deferred();
  setTimeout(function () {
    deferred.resolve('hello');
  }, 1000);
  return deferred.promise;
};

greetAsync()
  .then(function (value) {
    return value + ' world';
  })
  .then(function (value) {
    console.log(value);
  }); //1 másodperc múlva naplózza a "hello world"-öt

v2.x

javascript

var greetAsync = function () {
  return new Promise(function (resolve) {
    setTimeout(function () {
      resolve('hello');
    }, 1000);
  });
};

greetAsync()
  .then(function (value) {
    return value + ' world';
  })
  .then(function (value) {
    console.log(value);
  }); //1 másodperc múlva naplózza a "hello world"-öt

`m.sync` eltávolítva

Mivel a 2.x verzió szabványoknak megfelelő Promise objektumokat használ, a m.sync redundáns. Használja helyette a Promise.all-t.

v0.2.x

javascript

m.sync([
  m.request({ method: 'GET', url: 'https://api.github.com/users/lhorie' }),
  m.request({
    method: 'GET',
    url: 'https://api.github.com/users/dead-claudia',
  }),
]).then(function (users) {
  console.log('Contributors:', users[0].name, 'and', users[1].name);
});

v2.x

javascript

Promise.all([
  m.request({ method: 'GET', url: 'https://api.github.com/users/lhorie' }),
  m.request({
    method: 'GET',
    url: 'https://api.github.com/users/dead-claudia',
  }),
]).then(function (users) {
  console.log('Contributors:', users[0].name, 'and', users[1].name);
});

`xlink` névtér szükséges

A 0.2.x verzióban az xlink névtér volt az egyetlen támogatott attribútum-névtér, és ez speciális esetkezeléssel volt támogatva. Most a névtér-elemzés teljes mértékben támogatott, és a névtérrel rendelkező attribútumoknak explicit módon deklarálniuk kell a névterüket.

v0.2.x

javascript

m(
  'svg',
  // a `href` attribútum automatikusan névtérrel rendelkezik
  m("image[href='image.gif']")
);

v2.x

javascript

m(
  'svg',
  // Felhasználó által megadott névtér a `href` attribútumon
  m("image[xlink:href='image.gif']")
);

Nézeteken belüli beágyazott tömbök

A tömbök most fragmentumokat képviselnek, amelyek strukturálisan jelentősek a 2.x verziójú virtuális DOM-ban. Míg a 0.2.x verzióban a beágyazott tömbök egyetlen összefüggő virtuális csomópont listává lennének lapítva a diffing céljából, a 2.x verzió megőrzi a tömb szerkezetét. Ez azt jelenti, hogy egy adott tömb gyermekei nem tekinthetők a szomszédos tömbök gyermekeinek testvéreinek.

`vnode` egyenlőség ellenőrzések

Ha egy vnode szigorúan egyenlő azzal a vnode objektummal, amely a helyét foglalja el az utolsó rajzolásban, a 2.x verzió kihagyja a fa azon részét anélkül, hogy ellenőrizné a mutációkat, vagy aktiválná az életciklus-metódusokat az alatta lévő fában. A komponens dokumentációja további részleteket tartalmaz erről a kérdésről.

Átállás v0.2.x verzióról ​

m.prop eltávolítva ​

v0.2.x ​

v2.x ​

m.component eltávolítva ​

v0.2.x ​

v2.x ​

m.withAttr eltávolítva ​

v0.2.x ​

v2.x ​

m.version eltávolítva ​

config függvény ​

v0.2.x ​

v2.x ​

Változások az újrarajzolási viselkedésben ​

Nincsenek többé újrarajzolási zárak ​

Újrarajzolás megszakítása eseménykezelőkből ​

v0.2.x ​

v2.x ​

Szinkron újrarajzolás megváltozott ​

v0.2.x ​

v2.x ​

m.startComputation/m.endComputation eltávolítva ​

Komponens controller függvény ​

v0.2.x ​

v2.x ​

Komponens argumentumok ​

v0.2.x ​

v2.x ​

Komponens vnode gyermekek ​

v0.2.x ​

v2.x ​

DOM vnode gyermekek ​

Kulcsok ​

view() paraméterek ​

v0.2.x ​

v2.x ​

Komponensek átadása az m()-nek ​

v0.2.x ​

v2.x ​

Vnode-ok átadása az m.mount() és az m.route()-nak ​

v0.2.x ​

v2.x ​

m.route.mode ​

v0.2.x ​

v2.x ​

m.route() és anchor tagek ​

v0.2.x ​

v2.x ​

Útvonal sablonok ​

m.request URL-ek ​

m.route(route, params, shouldReplaceHistoryEntry) útvonalak ​

m.route útvonal minták ​

Az aktuális útvonal olvasása/írása ​

v0.2.x ​

v2.x ​

Útvonal paraméterek elérése ​

v0.2.x ​

v2.x ​

Lekérdezőszövegek építése/elemzése ​

v0.2.x ​

v2.x ​

Az unmounting megakadályozása ​

v0.2.x ​

v2.x ​

Kód futtatása a komponens eltávolításakor ​

v0.2.x ​

v2.x ​

m.request ​

v0.2.x ​

v2.x ​

m.request fejlécek ​

m.deferred eltávolítva ​

v0.2.x ​

v2.x ​

m.sync eltávolítva ​

v0.2.x ​

v2.x ​

xlink névtér szükséges ​

v0.2.x ​

Átállás v0.2.x verzióról

`m.prop` eltávolítva

v0.2.x

v2.x

`m.component` eltávolítva

v0.2.x

v2.x

`m.withAttr` eltávolítva

v0.2.x

v2.x

`m.version` eltávolítva

`config` függvény

v0.2.x

v2.x

Változások az újrarajzolási viselkedésben

Nincsenek többé újrarajzolási zárak

Újrarajzolás megszakítása eseménykezelőkből

v0.2.x

v2.x

Szinkron újrarajzolás megváltozott

v0.2.x

v2.x

`m.startComputation`/`m.endComputation` eltávolítva

Komponens `controller` függvény

v0.2.x

v2.x

Komponens argumentumok

v0.2.x

v2.x

Komponens vnode gyermekek

v0.2.x

v2.x

DOM vnode gyermekek

Kulcsok

`view()` paraméterek

v0.2.x

v2.x

Komponensek átadása az `m()`-nek

v0.2.x

v2.x

Vnode-ok átadása az `m.mount()` és az `m.route()`-nak

v0.2.x

v2.x

`m.route.mode`

v0.2.x

v2.x

`m.route()` és anchor tagek

v0.2.x

v2.x

Útvonal sablonok

`m.request` URL-ek

`m.route(route, params, shouldReplaceHistoryEntry)` útvonalak

`m.route` útvonal minták

Az aktuális útvonal olvasása/írása

v0.2.x

v2.x

Útvonal paraméterek elérése

v0.2.x

v2.x

Lekérdezőszövegek építése/elemzése

v0.2.x

v2.x

Az unmounting megakadályozása

v0.2.x

v2.x

Kód futtatása a komponens eltávolításakor

v0.2.x

v2.x

`m.request`

v0.2.x

v2.x

`m.request` fejlécek

`m.deferred` eltávolítva

v0.2.x

v2.x

`m.sync` eltávolítva

v0.2.x

v2.x

`xlink` névtér szükséges

v0.2.x