mirror of
https://github.com/sveltejs/svelte.git
synced 2024-12-01 17:30:59 +01:00
fire oncreate handlers for components inside await blocks (#1061)
This commit is contained in:
parent
9cfa174703
commit
c1b5bed6d2
@ -101,6 +101,10 @@ export default class AwaitBlock extends Node {
|
||||
block.addVariable(promise);
|
||||
block.addVariable(resolved);
|
||||
|
||||
// the `#component.root.set({})` below is just a cheap way to flush
|
||||
// any oncreate handlers. We could have a dedicated `flush()` method
|
||||
// but it's probably not worth it
|
||||
|
||||
block.builders.init.addBlock(deindent`
|
||||
function ${replace_await_block}(${token}, type, ${value}, ${params}) {
|
||||
if (${token} !== ${await_token}) return;
|
||||
@ -113,6 +117,8 @@ export default class AwaitBlock extends Node {
|
||||
${old_block}.d();
|
||||
${await_block}.c();
|
||||
${await_block}.m(${updateMountNode}, ${anchor});
|
||||
|
||||
#component.root.set({});
|
||||
}
|
||||
}
|
||||
|
||||
|
14
test/runtime/samples/await-component-oncreate/Foo.html
Normal file
14
test/runtime/samples/await-component-oncreate/Foo.html
Normal file
@ -0,0 +1,14 @@
|
||||
<p>{{value}}</p>
|
||||
<p>{{called}}</p>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return { called: false };
|
||||
},
|
||||
|
||||
oncreate() {
|
||||
this.set({ called: true });
|
||||
}
|
||||
};
|
||||
</script>
|
16
test/runtime/samples/await-component-oncreate/_config.js
Normal file
16
test/runtime/samples/await-component-oncreate/_config.js
Normal file
@ -0,0 +1,16 @@
|
||||
const promise = Promise.resolve(42);
|
||||
|
||||
export default {
|
||||
data: {
|
||||
promise
|
||||
},
|
||||
|
||||
test(assert, component, target) {
|
||||
return promise.then(() => {
|
||||
assert.htmlEqual(target.innerHTML, `
|
||||
<p>42</p>
|
||||
<p>true</p>
|
||||
`);
|
||||
});
|
||||
}
|
||||
};
|
13
test/runtime/samples/await-component-oncreate/main.html
Normal file
13
test/runtime/samples/await-component-oncreate/main.html
Normal file
@ -0,0 +1,13 @@
|
||||
{{#await promise then value}}
|
||||
<Foo :value />
|
||||
{{/await}}
|
||||
|
||||
<script>
|
||||
import Foo from './Foo.html';
|
||||
|
||||
export default {
|
||||
components: {
|
||||
Foo
|
||||
}
|
||||
};
|
||||
</script>
|
Loading…
Reference in New Issue
Block a user