vscode-github/vue.html at main · saba-iyad/vscode-github · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>hi</title>
    <link href="https://unpkg.com/tailwindcss@^2/dist/tailwind.min.css" rel="stylesheet">


</head>

<body>
    <div id="app">


        <!-- <h1>{{name}} </h1> -->
        <!--  <button v-on:click="changname">consol log</button> -->
        <!-- or- <button @click="changname">consol log</button> -->

        <!-- <input v-model:input="num1" type="text">
        <input  v-model:input="num2" type="text">
        <button v-on:click="plus">plus</button>
         or  <button @click="plus">plus</button> -->
        <!-- <h1>{{sum}} </h1>

        <script>
    let app =new Vue({
        el:'#app',
        data:{ num1:0,num2:0, sum:0},
       methods:{
          plus(){ this.sum= parseInt(this.num1)+parseInt(this.num2)}
        }
        }
    )
</script>-->


 <input  v-model:input="hoppies" class="border border-purple-600 px-3 py-6" type="text">
<button @click="hopye" class="border border-purple-600 ">go</button>
<p v-for="hopy in hopy"> {{hopy}} </p>


<!-- <h1> the name : {{ student.name}} </h1>
<h1>the age: {{student.age}} </h1>
<script>
    let app =new Vue({
        el:'#app',
        data:{ student:{
                        name:'sara', age:20, } },
       methods:{   }
        }

    )
</script>-->

<!-- <h1 v-shoo="greeting==true"  > hi</h1> -->
<!-- <h1 v-if="greeting"  > hi</h1>
<h1 v-else="greeting"  > no</h1>
<input v-model="name" >
<h1> {{name}} </h1>
<button  >go</button>
let app =new Vue({
    el:'#app',
    data:{greeting:1,
                    name:"" },
   methods:{   }
    }) -->

 <!-- <a  @click="activ ='sacshin1'"  class="activ =='sacshin1'? 'bg-blue-100' :'bg-red-100' "  >sacshin 1</a>
 <a  @click="activ ='sacshin2'"  class="rounded-full py-3 px-6 bg-blue-100" >sacshin 2</a>

<p v-if="activ =='sacshin1'"> sacshin 1Lorem ipsum, dolor sit amet consectetur adipisicing elit. Corrupti eligendi soluta quis voluptas reprehenderit aperiam, velit veniam est cupiditate sint! Expedita laboriosam id velit et magnam nobis alias delectus molestias?</p>

<p v-if="activ =='sacshin2'"> sacshin 2 Lorem ipsum, dolor sit amet consectetur adipisicing elit. Corrupti eligendi soluta quis voluptas reprehenderit aperiam, velit veniam est cupiditate sint! Expedita laboriosam id velit et magnam nobis alias delectus molestias?</p>
        </div> -->

    <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.js"></script>

<script>
     let app =new Vue({
        el:'#app',
        data:{ hoppies:'',hopy:[] },
       methods:{
                hopye(){this.hopy.push(this.hoppies)}  }
        })
    //  let app =new Vue({

    //     el:'#app',
    //     data:{
    //     activ:'',
    //              },
    //     methods:{   }
</script>


    </body>
    </html>