[client] entrance -> public timeline: use nested tag
This commit is contained in:
parent
d1b1113857
commit
c49c9f16f5
|
@ -1,5 +1,33 @@
|
||||||
<mk-public-timeline>
|
<mk-public-timeline>
|
||||||
<article each={ posts }>
|
<inside-renderer each="{ posts }"></inside-renderer>
|
||||||
|
<style>
|
||||||
|
:scope
|
||||||
|
|
||||||
|
display block
|
||||||
|
</style>
|
||||||
|
<script>
|
||||||
|
this.mixin('api');
|
||||||
|
|
||||||
|
this.posts = [];
|
||||||
|
this.isFetching = true;
|
||||||
|
|
||||||
|
this.on('mount', () => {
|
||||||
|
this.api('posts', {
|
||||||
|
limit: 5,
|
||||||
|
include_reposts: false,
|
||||||
|
include_replies: false
|
||||||
|
}).then(posts => {
|
||||||
|
this.update({
|
||||||
|
isFetching: false,
|
||||||
|
posts: posts
|
||||||
|
});
|
||||||
|
});
|
||||||
|
});
|
||||||
|
</script>
|
||||||
|
</mk-public-timeline>
|
||||||
|
|
||||||
|
<inside-renderer>
|
||||||
|
<article>
|
||||||
<img src={ user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
|
<img src={ user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
|
||||||
<div>
|
<div>
|
||||||
<header>
|
<header>
|
||||||
|
@ -7,7 +35,7 @@
|
||||||
<span class="username">@{ user.username }</span>
|
<span class="username">@{ user.username }</span>
|
||||||
</header>
|
</header>
|
||||||
<div class="body">
|
<div class="body">
|
||||||
<div class="text">{ text }</div>
|
<div class="text" ref="text"></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</article>
|
</article>
|
||||||
|
@ -59,28 +87,13 @@
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
<script>
|
<script>
|
||||||
this.mixin('api');
|
this.mixin('text');
|
||||||
this.mixin('text')
|
|
||||||
|
|
||||||
this.posts = [];
|
|
||||||
this.isFetching = true;
|
|
||||||
|
|
||||||
this.on('mount', () => {
|
this.on('mount', () => {
|
||||||
this.api('posts', {
|
this.mixin('text');
|
||||||
limit: 5,
|
const tokens = this.analyze(this.text);
|
||||||
include_reposts: false,
|
const text = this.compile(tokens);
|
||||||
include_replies: false
|
this.refs.text.innerHTML = text;
|
||||||
}).then(data => {
|
|
||||||
const posts = data.map(datum => {
|
|
||||||
const tokens = this.analyze(datum.text);
|
|
||||||
datum.text = this.compile(tokens);
|
|
||||||
return datum;
|
|
||||||
});
|
|
||||||
this.update({
|
|
||||||
isFetching: false,
|
|
||||||
posts: posts
|
|
||||||
});
|
|
||||||
});
|
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
</mk-public-timeline>
|
</inside-renderer>
|
||||||
|
|
Loading…
Reference in New Issue