Published
Edited
Oct 29, 2020
Importers
1 star
Insert cell
Insert cell
Insert cell
Insert cell
Insert cell
Vue.renderApp(Vue.createApp({
components: { CounterText },
template: `<CounterText />`,
}))
Insert cell
CounterText = Vue.defineComponent({
template: `
<div :style="{ color, fontSize: fontSize + 'px' }">
Counter: {{ counter }}
</div>
`,
data() {
return {
counter: 0,
color: "red",
fontSize: 25,
}
},
mounted() {
setInterval(() => {
this.counter += 1
}, 500)
}
})
Insert cell
Vue.renderApp(Vue.createApp({
template: `<div>{{ hi }}</div>`,
data() {
return { hi: "hello" }
},
}))
Insert cell
Vue.renderApp(Vue.createApp({
render() {
return Vue.h("div", {}, this.hi)
},
data() {
return { hi: "hello" }
},
}))
Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more