Merge remote-tracking branch 'origin/next' into next
This commit is contained in:
commit
d6cbc1c324
5 changed files with 22 additions and 14 deletions
|
|
@ -69,7 +69,7 @@ Let's create an HTML file to follow along:
|
||||||
|
|
||||||
### Hello world
|
### Hello world
|
||||||
|
|
||||||
Let's start as small as well can: render some text on screen. Copy the code below into your file (and by copy, I mean type it out - you'll learn better)
|
Let's start as small as we can: render some text on screen. Copy the code below into your file (and by copy, I mean type it out - you'll learn better)
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
var root = document.body
|
var root = document.body
|
||||||
|
|
|
||||||
|
|
@ -74,7 +74,7 @@ var User = {
|
||||||
module.exports = User
|
module.exports = User
|
||||||
```
|
```
|
||||||
|
|
||||||
Then we can add an `m.request` call to make an XHR request. For this tutorial, we'll make XHR calls to the [REM](http://rem-rest-api.herokuapp.com/) API, a mock REST API designed for rapid prototyping. This API returns a list of users from the `GET http://rem-rest-api.herokuapp.com/api/users` endpoint. Let's use `m.request` to make an XHR request and populate our data with the response of that endpoint.
|
Then we can add an `m.request` call to make an XHR request. For this tutorial, we'll make XHR calls to the [REM](http://rem-rest-api.herokuapp.com/) API, a mock REST API designed for rapid prototyping. This API returns a list of users from the `GET https://rem-rest-api.herokuapp.com/api/users` endpoint. Let's use `m.request` to make an XHR request and populate our data with the response of that endpoint.
|
||||||
|
|
||||||
```javascript
|
```javascript
|
||||||
// src/models/User.js
|
// src/models/User.js
|
||||||
|
|
@ -85,7 +85,7 @@ var User = {
|
||||||
loadList: function() {
|
loadList: function() {
|
||||||
return m.request({
|
return m.request({
|
||||||
method: "GET",
|
method: "GET",
|
||||||
url: "http://rem-rest-api.herokuapp.com/api/users",
|
url: "https://rem-rest-api.herokuapp.com/api/users",
|
||||||
withCredentials: true,
|
withCredentials: true,
|
||||||
})
|
})
|
||||||
.then(function(result) {
|
.then(function(result) {
|
||||||
|
|
@ -357,7 +357,7 @@ var User = {
|
||||||
loadList: function() {
|
loadList: function() {
|
||||||
return m.request({
|
return m.request({
|
||||||
method: "GET",
|
method: "GET",
|
||||||
url: "http://rem-rest-api.herokuapp.com/api/users",
|
url: "https://rem-rest-api.herokuapp.com/api/users",
|
||||||
withCredentials: true,
|
withCredentials: true,
|
||||||
})
|
})
|
||||||
.then(function(result) {
|
.then(function(result) {
|
||||||
|
|
@ -380,7 +380,7 @@ var User = {
|
||||||
loadList: function() {
|
loadList: function() {
|
||||||
return m.request({
|
return m.request({
|
||||||
method: "GET",
|
method: "GET",
|
||||||
url: "http://rem-rest-api.herokuapp.com/api/users",
|
url: "https://rem-rest-api.herokuapp.com/api/users",
|
||||||
withCredentials: true,
|
withCredentials: true,
|
||||||
})
|
})
|
||||||
.then(function(result) {
|
.then(function(result) {
|
||||||
|
|
@ -392,7 +392,7 @@ var User = {
|
||||||
load: function(id) {
|
load: function(id) {
|
||||||
return m.request({
|
return m.request({
|
||||||
method: "GET",
|
method: "GET",
|
||||||
url: "http://rem-rest-api.herokuapp.com/api/users/:id",
|
url: "https://rem-rest-api.herokuapp.com/api/users/:id",
|
||||||
data: {id: id},
|
data: {id: id},
|
||||||
withCredentials: true,
|
withCredentials: true,
|
||||||
})
|
})
|
||||||
|
|
@ -461,7 +461,12 @@ var User = require("../models/User")
|
||||||
module.exports = {
|
module.exports = {
|
||||||
oninit: function(vnode) {User.load(vnode.attrs.id)},
|
oninit: function(vnode) {User.load(vnode.attrs.id)},
|
||||||
view: function() {
|
view: function() {
|
||||||
return m("form", [
|
return m("form", {
|
||||||
|
onsubmit: function(e) {
|
||||||
|
e.preventDefault()
|
||||||
|
User.save()
|
||||||
|
}
|
||||||
|
}, [
|
||||||
m("label.label", "First name"),
|
m("label.label", "First name"),
|
||||||
m("input.input[type=text][placeholder=First name]", {
|
m("input.input[type=text][placeholder=First name]", {
|
||||||
oninput: m.withAttr("value", function(value) {User.current.firstName = value}),
|
oninput: m.withAttr("value", function(value) {User.current.firstName = value}),
|
||||||
|
|
@ -472,7 +477,7 @@ module.exports = {
|
||||||
oninput: m.withAttr("value", function(value) {User.current.lastName = value}),
|
oninput: m.withAttr("value", function(value) {User.current.lastName = value}),
|
||||||
value: User.current.lastName
|
value: User.current.lastName
|
||||||
}),
|
}),
|
||||||
m("button.button[type=submit]", {onclick: User.save}, "Save"),
|
m("button.button[type=submit]", "Save"),
|
||||||
])
|
])
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -491,7 +496,7 @@ var User = {
|
||||||
loadList: function() {
|
loadList: function() {
|
||||||
return m.request({
|
return m.request({
|
||||||
method: "GET",
|
method: "GET",
|
||||||
url: "http://rem-rest-api.herokuapp.com/api/users",
|
url: "https://rem-rest-api.herokuapp.com/api/users",
|
||||||
withCredentials: true,
|
withCredentials: true,
|
||||||
})
|
})
|
||||||
.then(function(result) {
|
.then(function(result) {
|
||||||
|
|
@ -503,7 +508,7 @@ var User = {
|
||||||
load: function(id) {
|
load: function(id) {
|
||||||
return m.request({
|
return m.request({
|
||||||
method: "GET",
|
method: "GET",
|
||||||
url: "http://rem-rest-api.herokuapp.com/api/users/:id",
|
url: "https://rem-rest-api.herokuapp.com/api/users/:id",
|
||||||
data: {id: id},
|
data: {id: id},
|
||||||
withCredentials: true,
|
withCredentials: true,
|
||||||
})
|
})
|
||||||
|
|
@ -515,7 +520,7 @@ var User = {
|
||||||
save: function() {
|
save: function() {
|
||||||
return m.request({
|
return m.request({
|
||||||
method: "PUT",
|
method: "PUT",
|
||||||
url: "http://rem-rest-api.herokuapp.com/api/users/:id",
|
url: "https://rem-rest-api.herokuapp.com/api/users/:id",
|
||||||
data: User.current,
|
data: User.current,
|
||||||
withCredentials: true,
|
withCredentials: true,
|
||||||
})
|
})
|
||||||
|
|
|
||||||
|
|
@ -18,7 +18,10 @@ module.exports = new function init() {
|
||||||
predicate()
|
predicate()
|
||||||
ctx = parent
|
ctx = parent
|
||||||
}
|
}
|
||||||
o.only = function(subject, predicate) {o(subject, only = predicate)}
|
o.only = function(subject, predicate, silent) {
|
||||||
|
if (!silent) console.log(highlight("/!\\ WARNING /!\\ o.only() mode"))
|
||||||
|
o(subject, only = predicate)
|
||||||
|
}
|
||||||
o.spy = function(fn) {
|
o.spy = function(fn) {
|
||||||
var spy = function() {
|
var spy = function() {
|
||||||
spy.this = this
|
spy.this = this
|
||||||
|
|
|
||||||
|
|
@ -12,7 +12,7 @@ new function(o) {
|
||||||
})
|
})
|
||||||
o.only(".only()", function() {
|
o.only(".only()", function() {
|
||||||
o(2).equals(2)
|
o(2).equals(2)
|
||||||
})
|
}, true)
|
||||||
})
|
})
|
||||||
|
|
||||||
o.run()
|
o.run()
|
||||||
|
|
|
||||||
|
|
@ -113,7 +113,7 @@ o.spec("render", function() {
|
||||||
o(updateB.callCount).equals(0)
|
o(updateB.callCount).equals(0)
|
||||||
o(removeB.callCount).equals(1)
|
o(removeB.callCount).equals(1)
|
||||||
})
|
})
|
||||||
o.only("update lifecycle methods work on children of recycled keyed", function() {
|
o("update lifecycle methods work on children of recycled keyed", function() {
|
||||||
var createA = o.spy()
|
var createA = o.spy()
|
||||||
var updateA = o.spy()
|
var updateA = o.spy()
|
||||||
var removeA = o.spy()
|
var removeA = o.spy()
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue