https://github.com/kernel-loophole/vue.js
Vue.js programming
https://github.com/kernel-loophole/vue.js
vue-components vue-router vue-slots
Last synced: 5 months ago
JSON representation
Vue.js programming
- Host: GitHub
- URL: https://github.com/kernel-loophole/vue.js
- Owner: kernel-loophole
- Created: 2021-11-02T13:39:04.000Z (over 4 years ago)
- Default Branch: main
- Last Pushed: 2022-03-11T19:09:23.000Z (over 4 years ago)
- Last Synced: 2025-01-24T10:46:47.224Z (over 1 year ago)
- Topics: vue-components, vue-router, vue-slots
- Language: HTML
- Homepage:
- Size: 7.08 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Vue
Vue.js
# Vue Components
```javascript
Vue.createApp({
data() {
return {
myplans: ['test', 'hello', 'make-it']
}
}
})
.component('paln', {
template: "#test_it",
props: {
name: {
type: String,
required: true
},
}
})
```
# Vue Methods
```javascript
let myapp = Vue.createApp({
data: function() {
return {
gretting: 'hello world ,this is vue app',
test1: false,
test2: false,
plans: ['helo', 'world']
}
},
methods: {
toggle() {
this.test1 = !this.test1
}
}
});
```
# Vue App configuraton
```javascript
import HelloWorld from './components/HelloWorld.vue'
// eslint-disable-next-line camelcase
import create_event from './components/base_compoent.vue'
// eslint-disable-next-line camelcase
import base_From from './components/baseFrom.vue'
export default {
name: 'App',
components: {
[HelloWorld.name]: HelloWorld,
[create_event.name]: create_event,
[base_From.name]: base_From
}
}
#app {
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
}
```
# else-if (conditions)
```javascript
![]()
instock
add to cards
{{vari.color}}
Details
{{detail}}
almost 2 pieces left
outstock
```