(cache)Text inputs • Svelte Examples

›
⌄
⌄
⌄
⌄
⌄
⌄
⌄
⌄
⌄
⌄
⌄
⌄
⌄
/* App.svelte generated by Svelte v4.2.19 */
import {
SvelteComponent,
append,
attr,
detach,
element,
init,
insert,
listen,
noop,
safe_not_equal,
set_data,
set_input_value,
space,
text
} from "svelte/internal";

import "svelte/internal/disclose-version";

function create_fragment(ctx) {
let input;
let t0;
let p;
let t1;
let t2_value = (/*name*/ ctx[0] || 'stranger') + "";
let t2;
let t3;
let mounted;
let dispose;

return {
c() {
input = element("input");
t0 = space();
p = element("p");
t1 = text("Hello ");
t2 = text(t2_value);
t3 = text("!");
attr(input, "placeholder", "enter your name");
},
m(target, anchor) {
insert(target, input, anchor);
set_input_value(input, /*name*/ ctx[0]);
insert(target, t0, anchor);
insert(target, p, anchor);
append(p, t1);
append(p, t2);
append(p, t3);

if (!mounted) {
dispose = listen(input, "input", /*input_input_handler*/ ctx[1]);
mounted = true;
}
},
p(ctx, [dirty]) {
if (dirty & /*name*/ 1 && input.value !== /*name*/ ctx[0]) {
set_input_value(input, /*name*/ ctx[0]);
}

if (dirty & /*name*/ 1 && t2_value !== (t2_value = (/*name*/ ctx[0] || 'stranger') + "")) set_data(t2, t2_value);
},
i: noop,
o: noop,
d(detaching) {
if (detaching) {
detach(input);
detach(t0);
detach(p);
}

mounted = false;
dispose();
}
};
}

function instance($$self, $$props, $$invalidate) {
let name = '';

function input_input_handler() {
name = this.value;
$$invalidate(0, name);
}

return [name, input_input_handler];
}

class App extends SvelteComponent {
constructor(options) {
super();
init(this, options, instance, create_fragment, safe_not_equal, {});
}
}

export default App;