mirror of https://github.com/sveltejs/svelte
only update attributes with dynamic dependencies - fixes #3526
Richard Harris
5 years ago
parent
41f5961ef9
commit
84ab1b1b8b
@ -0,0 +1,112 @@
|
||||
/* generated by Svelte vX.Y.Z */
|
||||
import {
|
||||
SvelteComponent,
|
||||
destroy_component,
|
||||
detach,
|
||||
element,
|
||||
init,
|
||||
insert,
|
||||
listen,
|
||||
mount_component,
|
||||
safe_not_equal,
|
||||
set_input_value,
|
||||
space,
|
||||
transition_in,
|
||||
transition_out
|
||||
} from "svelte/internal";
|
||||
import Foo from "./Foo.svelte";
|
||||
import Bar from "./Bar.svelte";
|
||||
|
||||
function create_fragment(ctx) {
|
||||
var t0, t1, input, current, dispose;
|
||||
|
||||
var foo = new Foo({ props: { x: y } });
|
||||
|
||||
var bar = new Bar({ props: { x: ctx.z } });
|
||||
|
||||
return {
|
||||
c() {
|
||||
foo.$$.fragment.c();
|
||||
t0 = space();
|
||||
bar.$$.fragment.c();
|
||||
t1 = space();
|
||||
input = element("input");
|
||||
dispose = listen(input, "input", ctx.input_input_handler);
|
||||
},
|
||||
|
||||
m(target, anchor) {
|
||||
mount_component(foo, target, anchor);
|
||||
insert(target, t0, anchor);
|
||||
mount_component(bar, target, anchor);
|
||||
insert(target, t1, anchor);
|
||||
insert(target, input, anchor);
|
||||
|
||||
set_input_value(input, ctx.z);
|
||||
|
||||
current = true;
|
||||
},
|
||||
|
||||
p(changed, ctx) {
|
||||
var bar_changes = {};
|
||||
if (changed.z) bar_changes.x = ctx.z;
|
||||
bar.$set(bar_changes);
|
||||
|
||||
if (changed.z && (input.value !== ctx.z)) set_input_value(input, ctx.z);
|
||||
},
|
||||
|
||||
i(local) {
|
||||
if (current) return;
|
||||
transition_in(foo.$$.fragment, local);
|
||||
|
||||
transition_in(bar.$$.fragment, local);
|
||||
|
||||
current = true;
|
||||
},
|
||||
|
||||
o(local) {
|
||||
transition_out(foo.$$.fragment, local);
|
||||
transition_out(bar.$$.fragment, local);
|
||||
current = false;
|
||||
},
|
||||
|
||||
d(detaching) {
|
||||
destroy_component(foo, detaching);
|
||||
|
||||
if (detaching) {
|
||||
detach(t0);
|
||||
}
|
||||
|
||||
destroy_component(bar, detaching);
|
||||
|
||||
if (detaching) {
|
||||
detach(t1);
|
||||
detach(input);
|
||||
}
|
||||
|
||||
dispose();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
let y = 1;
|
||||
|
||||
function instance($$self, $$props, $$invalidate) {
|
||||
|
||||
let z = 2;
|
||||
|
||||
function input_input_handler() {
|
||||
z = this.value;
|
||||
$$invalidate('z', z);
|
||||
}
|
||||
|
||||
return { z, input_input_handler };
|
||||
}
|
||||
|
||||
class Component extends SvelteComponent {
|
||||
constructor(options) {
|
||||
super();
|
||||
init(this, options, instance, create_fragment, safe_not_equal, []);
|
||||
}
|
||||
}
|
||||
|
||||
export default Component;
|
||||
@ -0,0 +1,13 @@
|
||||
<script>
|
||||
import Foo from './Foo.svelte';
|
||||
import Bar from './Bar.svelte';
|
||||
|
||||
let y = 1;
|
||||
let z = 2;
|
||||
</script>
|
||||
|
||||
<Foo x={y}/>
|
||||
<Bar x={z}/>
|
||||
|
||||
<!-- ensure z is considered dynamic, even though the binding is encountered late -->
|
||||
<input bind:value={z}>
|
||||
Loading…
Reference in new issue