Slim 3.0.0 - Reloaded!
Please notice: Breaking Changes
Slim is now rebuilt keeping the same functionality (and plenty of more added), and reduced the code by about 50%!
It is 6404 Bytes only (gzipped).
Simplest syntax (ever)
Binding (PAP)
<some-element bind:user-data="myUser"></some-element>
will bind parent::myUser to child::userData (and the attribute user-data)
<some-element bind:user-data="getData(myUser)"></some-element>
will wrap any changes to parent::myUser with parent::getData function
Binding (Text)
<p bind>Hello {{myUser.name}}. You have {{messages.length}} unread messages</p>
<p bind>Here is one: {{getRandomMessage(messages)}}</p>
Repeaters
<ol><li s:repeat="items as item" bind>{{item.title}}</li></ol>
Conditional
<div slim-if="someBoolean">
<p>Hello, Slim.js</p>
</div>
# Custom bindings (added in 3.0.0) :sparkles:
`[static]` Slim::bind(sourceElement, scopedElement, `string` expression, `function` executor)
Example usage:
```javascript
Slim.bind(this, other, 'user.name', (target, computedValue) => {
// user has changed
// computedValue = "John"
// do anything on target
})
Plugins ✨
AOP style element management
Slim.plugin(phase, target => {
// element is now in phase
// possible phases are: "create", "added", "beforeRender", "afterRender", "removed"
})
Reduced clutter
no more underscored "private" properties. Everything is wrapped inside native Symbols.
Documentation
The documentation of Slim 3 is a work in progress. Collaborators are welcome.
Deprecated in 3.0.0
on%Prop%
Changedis no more. Developers can use
Slim.bindor
Slim.bindOwn` to handle changes in properties- Array monkey patching removed. Slim encourages you to use immutable arrays. It's faster.
✨Brand new Slim.js!✨