grgr
/
diffractive-cookbook
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

logs

Browse Source
master
km0 3 years ago
parent b7eb211300
commit 9c530e7bb8
3 changed files with 84 additions and 81 deletions
Show Stats Download Patch File Download Diff File

78
components/CookbookForm.js
Unescape Escape View File

@ -1,43 +1,57 @@
export default { export default {
name : "CookbookForm", name: "CookbookForm",
setup(){ setup() {
const {ref}=Vue const { ref } = Vue;
const title = ref('') const title = ref("");
const description = ref('') const description = ref("");
const nature = ref('') const nature = ref("");
const log = ref('') const logs = ref([""]);
const who = ref('') const who = ref("");
return{title,description,nature,log,who} return { title, description, nature, logs, who };
}, },
template: ` template: `
<form action="">
<label for="title">Title</label>
<input type="text" v-model='title'/>
<label for="description">Description</label> <section class='recipe'>
<textarea v-model="description"></textarea> <label for="title">Title</label>
<input type="text" v-model='title'/>
<label for="nature">Nature of the input</label> <label for="description">Description</label>
<input type="text" v-model="nature" /> <textarea v-model="description"></textarea>
<label for="log">Process Log</label> <label for="nature">Nature of the input</label>
<textarea v-model="log"></textarea> <input type="text" v-model="nature" />
<label for="who">Who</label>
<input type="text" v-model="who" />
</form>
<label for="log">Process Log</label>
<pre> <textarea v-model="logs[index]" v-for="(log, index) in logs" :key="index"></textarea>
title:{{title}} <button @click="logs.push('')">Add Step</button>
description:{{description}}
nature:{{nature}}
log:{{log}}
who:{{who}}
</pre>
<label for="who">Who</label>
<input type="text" v-model="who" />
</section>
` <dl>
} <dt>Title</dt>
<dd>{{title}}</dd>
<dt>Description</dt>
<dd>{{description}}</dd>
<dt>Nature</dt>
<dd>{{nature}}</dd>
<dt>Log</dt>
<dd>
<ul>
<li v-for="log in logs">{{log}}</li>
</ul>
</dd>
<dt>Who</dt>
<dd>{{who}}</dd>
</dl>
`,
};

63
index.html
Unescape Escape View File

@ -1,41 +1,28 @@
<!DOCTYPE html> <!DOCTYPE html>
<html lang="en"> <html lang="en">
<head> <head>
<meta charset="UTF-8"> <meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>diffractive reading</title> <link rel="stylesheet" href="style.css" />
</head> <title>diffractive reading</title>
<body> </head>
<body>
<script src="https://unpkg.com/vue@3"></script>
<div id="app"><cookbook-form></cookbook-form></div>
<script type="module">
import CookbookForm from "./components/CookbookForm.js";
const { createApp } = Vue;
createApp({
components: { CookbookForm },
<script src="https://unpkg.com/vue@3"></script> data() {
return {
<div id="app"><cookbook-form></cookbook-form></div> message: "Hello Vue!",
};
},
<script type="module"> }).mount("#app");
import CookbookForm from "./components/CookbookForm.js" </script>
const { createApp } = Vue </body>
createApp({
components : {CookbookForm},
data() {
return {
message: 'Hello Vue!'
}
}
}).mount('#app')
</script>
</body>
</html> </html>

2
style.css
Unescape Escape View File

@ -0,0 +1,2 @@
.recipe {
}
Write Preview
Loading…
Cancel
Save