8000 fix: fix consecutive v-if's and v-for's · brysem/nativescript-vue@821d726 · GitHub
[go: up one dir, main page]

Skip to content

Commit 821d726

Browse files
committed
fix: fix consecutive v-if's and v-for's
fix nativescript-vue#127 fix nativescript-vue#240
1 parent 4f5529b commit 821d726

File tree

4 files changed

+182
-4
lines changed

4 files changed

+182
-4
lines changed

platform/nativescript/renderer/CommentNode.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
import ElementNode from './ElementNode'
22

3-
export default class TextNode extends ElementNode {
3+
export default class CommentNode extends ElementNode {
44
constructor(text) {
55
super('comment')
66

platform/nativescript/renderer/ViewNode.js

Lines changed: 17 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -153,7 +153,13 @@ export default class ViewNode {
153153
throw new Error(`Can't insert child.`)
154154
}
155155

156-
if (referenceNode && referenceNode.parentNode !== this) {
156+
// in some rare cases insertBefore is called with a null referenceNode
157+
// this makes sure that it get's appended as the last child
158+
if (!referenceNode) {
159+
return this.appendChild(childNode)
160+
}
161+
162+
if (referenceNode.parentNode !== this) {
157163
throw new Error(
158164
`Can't insert child, because the reference node has a different parent.`
159165
)
@@ -166,7 +172,11 @@ export default class ViewNode {
166172
}
167173

168174
if (childNode.parentNode === this) {
169-
throw new Error(`Can't insert child, because it is already a child.`)
175+
// we don't need to throw an error here, because it is a valid case
176+
// for example when switching the order of elements in the tree
177+
// fixes #127 - see for more details
178+
// fixes #240
179+
// throw new Error(`Can't insert child, because it is already a child.`)
170180
}
171181

172182
let index = this.childNodes.indexOf(referenceNode)
@@ -193,7 +203,11 @@ export default class ViewNode {
193203
}
194204

195205
if (childNode.parentNode === this) {
196-
throw new Error(`Can't append child, because it is already a child.`)
206+
// we don't need to throw an error here, because it is a valid case
207+
// for example when switching the order of elements in the tree
208+
// fixes #127 - see for more details
209+
// fixes #240
210+
// throw new Error(`Can't append child, because it is already a child.`)
197211
}
198212

199213
childNode.parentNode = this

samples/app/127.js

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
const Vue = require('./nativescript-vue')
22

3+
Vue.config.debug = true
34
Vue.config.silent = false
45

56
new Vue({

samples/app/240.js

Lines changed: 163 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,163 @@
1+
const Vue = require('./nativescript-vue')
2+
3+
Vue.config.debug = true
4+
Vue.config.silent = false
5+
6+
new Vue({
7+
computed: {
8+
filteredFoo() {
9+
if (this.submittedPhrase == '') {
10+
return this.fooList
11+
}
12+
13+
let foo = this.fooList.filter(item => {
14+
return (
15+
item.title
16+
.toLowerCase()
17+
.indexOf(this.submittedPhrase.toLowerCase()) !== -1
18+
)
19+
})
20+
21+
return foo
22+
},
23+
filteredBar() {
24+
if (this.submittedPhrase == '') {
25+
return this.barList
26+
}
27+
28+
let bar = this.barList.filter(item => {
29+
return (
30+
item.title
31+
.toLowerCase()
32+
.indexOf(this.subm 341A ittedPhrase.toLowerCase()) !== -1
33+
)
34+
})
35+
36+
return bar
37+
},
38+
filteredFooBar() {
39+
if (this.submittedPhrase == '') {
40+
return this.fooBarList
41+
}
42+
43+
let fooBar = this.fooBarList.filter(item => {
44+
return (
45+
item.title
46+
.toLowerCase()
47+
.indexOf(this.submittedPhrase.toLowerCase()) !== -1
48+
)
49+
})
50+
51+
return fooBar
52+
}
53+
},
54+
methods: {
55+
onSearchSubmit(args) {
56+
let searchBar = args.object
57+
console.log('You are searching for [' + searchBar.text + ']')
58+
59+
this.submittedPhrase = searchBar.text
60+
}
61+
},
62+
data() {
63+
return {
64+
searchPhrase: '',
65+
submittedPhrase: '',
66+
fooList: [
67+
{
68+
id: 1,
69+
title: 'Foo 1'
70+
},
71+
{
72+
id: 2,
73+
title: 'Foo 2'
74+
},
75+
{
76+
id: 3,
77+
title: 'Foo 3'
78+
}
79+
],
80+
barList: [
81+
{
82+
id: 11,
83+
title: 'Bar 10000 1'
84+
},
85+
{
86+
id: 12,
87+
title: 'Bar 2'
88+
},
89+
{
90+
id: 13,
91+
title: 'Bar 3'
92+
}
93+
],
94+
fooBarList: [
95+
{
96+
id: 21,
97+
title: 'Foo Bar 1'
98+
},
99+
{
100+
id: 22,
101+
title: 'Foo Bar 2'
102+
},
103+
{
104+
id: 23,
105+
title: 'Foo Bar 3'
106+
}
107+
]
108+
}
109+
},
110+
template: `
111+
<Frame>
112+
<Page class="page">
113+
<ActionBar title="Issue #240" class="action-bar" />
114+
<ScrollView>
115+
<StackLayout class="home-panel">
116+
<SearchBar hint="Search hint" :text="searchPhrase" @submit="onSearchSubmit" />
117+
118+
<StackLayout>
119+
<Label >
120+
<FormattedString>
121+
<Span text="Keyword : "/>
122+
<Span :text="searchPhrase" />
123+
</FormattedString>
124+
</Label>
125+
</StackLayout>
126+
127+
<StackLayout>
128+
<Lab FA09 el >
129+
<FormattedString>
130+
<Span text="Submitted : "/>
131+
<Span :text="submittedPhrase" />
132+
</FormattedString>
133+
</Label>
134+
</StackLayout>
135+
136+
137+
<!-- Foo List -->
138+
<Label text="Foo" style="font-weight: bold; margin-top:8"></Label>
139+
<StackLayout v-for="(item, index) in filteredFoo" :key="item.id">
140+
<Label :text="item.title"></Label>
141+
</StackLayout>
142+
143+
144+
<!-- Bar List -->
145+
<Label text="Bar" style="font-weight: bold; margin-top:8"></Label>
146+
<StackLayout v-for="(item, index) in filteredBar" :key="item.id">
147+
<Label :text="item.title"></Label>
148+
</StackLayout>
149+
150+
151+
<!-- FooBar List -->
152+
<Label text="FooBar" style="font-weight: bold; margin-top:8"></Label>
153+
<StackLayout v-for="(item, index) in filteredFooBar" :key="item.id">
154+
<Label :text="item.title"></Label>
155+
</StackLayout>
156+
157+
158+
</StackLayout>
159+
</ScrollView>
160+
</Page>
161+
</Frame>
162+
`
163+
}).$start()

0 commit comments

Comments
 (0)
0