Skip to content

Instantly share code, notes, and snippets.

@yoshuawuyts
Created June 21, 2016 01:15
Show Gist options
  • Save yoshuawuyts/ed389a8ebf852b9cf1dc2048e8592e0b to your computer and use it in GitHub Desktop.
Save yoshuawuyts/ed389a8ebf852b9cf1dc2048e8592e0b to your computer and use it in GitHub Desktop.
Trying to add items to a list
const choo = require('choo')
const app = choo()
function view (params, state, send) {
return choo.view`
<main>
<h1>${state.title}</h1>
<ul>
${state.theList.map(function (item) {
return choo.view`<li>${item}</li>`
})}
</ul>
<form onsubmit=${onSubmit}>
New: <input type="text" name="new_item" value="foo" autofocus>
<input type="submit" value="Submit">
</form>
</main>
`
function onSubmit (event) {
send('addItem', { data: new FormData(event.target) });
event.preventDefault()
}
}
var newlist = ['lion', 'tiger', 'bear' ];
app.model({
state: {
title: 'Some title',
theList: ['item 1', 'item 2', 'item 3', 'item 4' ]
},
reducers: {
addItem: function(action,state) {
console.log('action=', action.data, ' state=', state);
return { theList: state.theList.push(action.value) }
}
}
});
app.router((route) => [
route('/', view)
]);
const tree = app.start();
document.body.appendChild(tree);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment