Skip to content

Commit 8bac4fa

Browse files
MachinisteWebMachinisteWeb
committed
Merge remote-tracking branch 'upstream/master'
# Conflicts: # src/v2/cookbook/unit-testing-vue-components.md # src/v2/guide/comparison.md # src/v2/guide/components-dynamic-async.md # src/v2/guide/components-edge-cases.md # src/v2/guide/components.md # src/v2/guide/deployment.md # src/v2/guide/events.md # src/v2/guide/forms.md # src/v2/guide/index.md # src/v2/guide/installation.md # src/v2/guide/single-file-components.md # src/v2/guide/transitioning-state.md # src/v2/guide/transitions.md # src/v2/guide/unit-testing.md # src/v2/style-guide/index.md # themes/vue/layout/partials/vueschool_banner.ejs Signed-off-by: Haeresis <bruno.lesieur@gmail.com>
2 parents 111462d + bb3acc6 commit 8bac4fa

File tree

79 files changed

+1347
-522
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

79 files changed

+1347
-522
lines changed

‎pre-deploy.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -39,7 +39,7 @@ Promise.all([
3939
installation
4040
.replace(/vue_version: .*/, 'vue_version: ' + version)
4141
.replace(/gz_size:.*/g, `gz_size: "${prodSize}"`)
42-
.replace(/\/vue@[\d\.]+\//g, `/vue@${version}/`)
42+
.replace(/\/vue@[\d\.]+/g, `/vue@${version}`)
4343
)
4444
console.log(`\nSuccessfully updated Vue version and gzip file size.\n`)
4545
}).catch(err => {

‎src/resources/partners.md

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -42,7 +42,12 @@ partners_list:
4242
name: Modus Create
4343
logo: https://res.cloudinary.com/modus-labs/image/upload/v1533109874/modus/logo-vertical-black.svg
4444
description:
45-
"Modus Create is a digital product agency that supports clients with business and product strategy consulting, customer experience, cloud services, and Agile software delivery. Our official partnerships with Atlassian, AWS, InVision, Cloudflare, GitHub, Ionic Framework, and Vue.js reinforce our proven results with digital transformation with organizations from startups to the Fortune 100."
45+
"Modus Create is a disruptive consulting firm that helps companies transform for success in the digital future.
46+
47+
Clients work with Modus to effect transformational change through a unique collaborative engagement model that focuses on strategy, product design/build, user experience, company culture, and process change to accelerate their response to digital disruption.
48+
49+
Modus is uniquely expert at executing within the new reality of global talent sourcing and globally distributed teams. Modus culture is based on recruiting only top talent regardless of their location. Modus delivers time zone-aligned, highly productive, English-speaking teams, accessibility, and a totally collaborative environment regardless of individual location.
50+
"
4651
proficiencies:
4752
- name: Vue.js
4853
url: https://moduscreate.com/partners/vue/?utm_source=Vue&utm_medium=Partner-Page&utm_campaign=Vue_partnerpage

‎src/v2/cookbook/form-validation.md

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -206,7 +206,7 @@ const app = new Vue({
206206
e.preventDefault();
207207
},
208208
validEmail: function (email) {
209-
var re = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
209+
var re = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
210210
return re.test(email);
211211
}
212212
}

‎src/v2/cookbook/unit-testing-vue-components.md

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -150,9 +150,11 @@ import Foo from './Foo.vue'
150150
describe('Foo', () => {
151151
it('restitue un message et répond correctement à la saisie de l\'utilisateur', () => {
152152
const wrapper = shallowMount(Foo, {
153-
data: {
154-
message: 'Hello World',
155-
username: ''
153+
data() {
154+
return {
155+
message: 'Hello World',
156+
username: ''
157+
}
156158
}
157159
})
158160

‎src/v2/examples/vue-20-accessing-parent-component-instance/index.html

Lines changed: 91 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,91 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Dependency Injection Google Maps Demo</title>
5+
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAHbknPTCvUSgWwU0jJ68m4h6b7vpyP6hM"></script>
6+
<script src="https://unpkg.com/vue"></script>
7+
<style>
8+
.map {
9+
width: 100%;
10+
height: 400px;
11+
}
12+
</style>
13+
</head>
14+
<body>
15+
<div id="app">
16+
<google-map>
17+
<google-map-marker v-bind:places="vueConfCities"></google-map-marker>
18+
</google-map>
19+
</div>
20+
21+
<script>
22+
Vue.component("google-map", {
23+
data: function() {
24+
return {
25+
map: null
26+
};
27+
},
28+
mounted: function() {
29+
this.map = new google.maps.Map(this.$el, {
30+
center: { lat: 0, lng: 0 },
31+
zoom: 1
32+
});
33+
},
34+
methods: {
35+
getMap: function(found) {
36+
var vm = this;
37+
function checkForMap() {
38+
if (vm.map) {
39+
found(vm.map);
40+
} else {
41+
setTimeout(checkForMap, 50);
42+
}
43+
}
44+
checkForMap();
45+
}
46+
},
47+
template: '<div class="map"><slot></slot></div>'
48+
});
49+
50+
Vue.component("google-map-marker", {
51+
props: ["places"],
52+
created: function() {
53+
var vm = this;
54+
vm.$parent.getMap(function(map) {
55+
vm.places.forEach(function(place) {
56+
new google.maps.Marker({
57+
position: place.position,
58+
map: map
59+
});
60+
});
61+
});
62+
},
63+
render(h) {
64+
return null;
65+
}
66+
});
67+
68+
new Vue({
69+
el: "#app",
70+
data: {
71+
vueConfCities: [
72+
{
73+
name: "Wrocław",
74+
position: {
75+
lat: 51.107885,
76+
lng: 17.038538
77+
}
78+
},
79+
{
80+
name: "New Orleans",
81+
position: {
82+
lat: 29.951066,
83+
lng: -90.071532
84+
}
85+
}
86+
]
87+
}
88+
});
89+
</script>
90+
</body>
91+
</html>

‎src/v2/examples/vue-20-accessing-parent-component-instance/package.json

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
{
2+
"name": "vue-20-accessing-parent-component-instance",
3+
"version": "1.0.0",
4+
"description": "Vue.js example accessing Parent Component Instance using Google Maps.",
5+
"main": "index.html",
6+
"scripts": {
7+
"start": "serve"
8+
},
9+
"keywords": [],
10+
"license": "MIT",
11+
"devDependencies": {
12+
"serve": "^11.2.0"
13+
}
14+
}

‎src/v2/examples/vue-20-accessing-parent-component-instance/sandbox.config.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"template": "static"
3+
}

‎src/v2/examples/vue-20-component-blog-post-example/index.html

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Component Blog Post Example</title>
5+
<script src="https://unpkg.com/vue"></script>
6+
</head>
7+
<body>
8+
<div id="blog-post-demo" class="demo">
9+
<blog-post
10+
v-for="post in posts"
11+
v-bind:key="post.id"
12+
v-bind:title="post.title"
13+
></blog-post>
14+
</div>
15+
16+
<script>
17+
Vue.component("blog-post", {
18+
props: ["title"],
19+
template: "<h3>{{ title }}</h3>"
20+
});
21+
22+
new Vue({
23+
el: "#blog-post-demo",
24+
data: {
25+
posts: []
26+
},
27+
created: function() {
28+
// Alias the component instance as `vm`, so that we
29+
// can access it inside the promise function
30+
var vm = this;
31+
// Fetch our array of posts from an API
32+
fetch("https://jsonplaceholder.typicode.com/posts")
33+
.then(function(response) {
34+
return response.json();
35+
})
36+
.then(function(data) {
37+
vm.posts = data;
38+
});
39+
}
40+
});
41+
</script>
42+
</body>
43+
</html>

‎src/v2/examples/vue-20-component-blog-post-example/package.json

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
{
2+
"name": "vue-20-component-blog-post-example",
3+
"version": "1.0.0",
4+
"description": "Dynamically passing props, like when fetching posts from an API.",
5+
"main": "index.html",
6+
"scripts": {
7+
"start": "serve"
8+
},
9+
"keywords": [],
10+
"license": "MIT",
11+
"devDependencies": {
12+
"serve": "^11.2.0"
13+
}
14+
}

‎src/v2/examples/vue-20-component-blog-post-example/sandbox.config.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"template": "static"
3+
}

‎src/v2/examples/vue-20-dependency-injection/index.html

Lines changed: 97 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,97 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<title>Dependency Injection Google Maps Demo</title>
5+
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyAHbknPTCvUSgWwU0jJ68m4h6b7vpyP6hM"></script>
6+
<script src="https://unpkg.com/vue"></script>
7+
<style>
8+
.map {
9+
width: 100%;
10+
height: 400px;
11+
}
12+
</style>
13+
</head>
14+
<body>
15+
<div id="app">
16+
<google-map>
17+
<google-map-marker v-bind:places="vueConfCities"></google-map-marker>
18+
</google-map>
19+
</div>
20+
21+
<script>
22+
Vue.component("google-map", {
23+
provide: function() {
24+
return {
25+
getMap: this.getMap
26+
};
27+
},
28+
data: function() {
29+
return {
30+
map: null
31+
};
32+
},
33+
mounted: function() {
34+
this.map = new google.maps.Map(this.$el, {
35+
center: { lat: 0, lng: 0 },
36+
zoom: 1
37+
});
38+
},
39+
methods: {
40+
getMap: function(found) {
41+
var vm = this;
42+
function checkForMap() {
43+
if (vm.map) {
44+
found(vm.map);
45+
} else {
46+
setTimeout(checkForMap, 50);
47+
}
48+
}
49+
checkForMap();
50+
}
51+
},
52+
template: '<div class="map"><slot></slot></div>'
53+
});
54+
55+
Vue.component("google-map-marker", {
56+
inject: ["getMap"],
57+
props: ["places"],
58+
created: function() {
59+
var vm = this;
60+
vm.getMap(function(map) {
61+
vm.places.forEach(function(place) {
62+
new google.maps.Marker({
63+
position: place.position,
64+
map: map
65+
});
66+
});
67+
});
68+
},
69+
render(h) {
70+
return null;
71+
}
72+
});
73+
74+
new Vue({
75+
el: "#app",
76+
data: {
77+
vueConfCities: [
78+
{
79+
name: "Wrocław",
80+
position: {
81+
lat: 51.107885,
82+
lng: 17.038538
83+
}
84+
},
85+
{
86+
name: "New Orleans",
87+
position: {
88+
lat: 29.951066,
89+
lng: -90.071532
90+
}
91+
}
92+
]
93+
}
94+
});
95+
</script>
96+
</body>
97+
</html>

‎src/v2/examples/vue-20-dependency-injection/package.json

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
{
2+
"name": "vue-20-dependency-injection",
3+
"version": "1.0.0",
4+
"description": "Vue.js Dependency Injection example using Google Maps.",
5+
"main": "index.html",
6+
"scripts": {
7+
"start": "serve"
8+
},
9+
"keywords": [],
10+
"license": "MIT",
11+
"devDependencies": {
12+
"serve": "^11.2.0"
13+
}
14+
}

‎src/v2/examples/vue-20-dependency-injection/sandbox.config.json

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
{
2+
"template": "static"
3+
}

0 commit comments

Comments
 (0)