<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="style.css">
<script src="//cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
<script src="//unpkg.com/axios/dist/axios.min.js"></script>
</head>
<body>
<h1>Hello Plunker!</h1>
<div id="app">
name: <input size="10" type="text" v-model="name" >
iq: <input size="10" type="text" v-model="iq" >
<textarea v-model="res" ></textarea>
</div>
<script src="script.js"></script>
</body>
</html>
let app = new Vue({
el: '#app',
data: {
url: 'https://lcdp003.enebular.com/new01/',
res: '',
name: 'aita',
iq: '105'
},
//created() {
//mounted() {
//updated() {
// app.post();
//},
methods: {
window: onload = function() {
app.post();
},
post: function() {
let param = new URLSearchParams();
param.append("name", app.name);
param.append("iq", app.iq);
axios.post(app.url, param).then(response => {
app.res = response.data;
}).catch(error => {
alert(error);
});
},
}
})
/* Styles go here */
* {
padding: 0;
border: 1;
}
html, body, #app {
height: 98%;
}
textarea {
width: 100%;
height: 100%;
font-family: "メイリオ", sans-serif;
font-size: 20px;
}
textarea:focus {
outline: none;
}