I have a funnel where users start with giving a list of words. When they move to the next step an array is created for each word. Users have the ability to go back and add words so I need to be able to detect that the amount of words has had a change in length. After detecting the length I want to be able to either add the corresponding amount of new arrays or delete the previous arrays.
I currently have a 'Watch' property that is watching a computed property that is returning the length of a user's input. I also have a data property of type boolean to keep track if a user has gone passed the user input page so that the original function will run only once. Then if they go back the function within Watch will check that its value is 'True', meaning they were already on the next step and they went back. However, the function within Watch is not firing. I verified that the length of the input is actually changing and also the boolean is set to 'true'. So the problem I think is somewhere within my Watch property but not sure what it is.
data: {
addedKeywords: false,
newAds:[
[]
]
},
methods: {
baseAds(){
if(this.step3Base == false){
this.newAds[0].push({
id: 0,
headline1: 'Headline 1',
headline2: 'Headline 2',
headline3: 'headline3',
desc1: 'This is your description 1',
desc2: 'This is your description 2',
finalurl: 'www.finalURL.com',
path1: '',
path2: '',
boolean: true
})
for(var x = 1; x < this.options.length; x++){
this.newAds.push([]);
}
}
this.step3Base = true;
},
restOfAds (){
var length = this.options.length
if(this.addedKeywords === false){
for(var x = 1; x < length; x++){
this.newAds[x].push({
id: x,
headline1: 'New',
})
}
this.addedKeywords = true;
}
},
lengthInput: function (){
return this.options.length
}
},
watch: {
lengthInput: function(oldlength, newLength){
if(newLength > oldlength && this.addedKeywords != false){
for(var x = oldLength; x < newLength; x++){
this.newAds.push([{
id: x,
headline1: 'New',
}])
}
}
}
}
The end goal is to be able to let a user go back and add words and then have new arrays added to the main array for the corresponding new words