我有一个用户个人资料部分,我试图让用户编辑他们的信息.我正在使用vuex存储用户配置文件数据并将其拉入表单.编辑表单位于userProfile组件的子组件中 - 加载数据保存将其提交给VUEX.
所以我可以使用VUEX中的数据填充表单,但是只要我更改表单中的任何值,它就会更改父组件中的值.
在保存表单之前,我没有对VUEX进行更改,因此这意味着数据绑定到VUEX的两个方向.我觉得这是不可能的.在这种情况下,不希望由于用户是否更改某些数据,然后导航而不实际点击"保存",数据仍然是VUEX已更改.
注意,这是一个简化的例子.我实际上使用路由器视图来加载子组件,或者我将通过道具传递数据.我已经测试过直接加载编辑配置文件组件,就像它在下面一样,我有同样的问题.
请参阅下面的代码,我找不到为什么数据被发送回商店.任何帮助是极大的赞赏.
在父级中,我设置检索用户数据,如下所示:
<template>
<div class="content">
<h1>{{getUserDetails.firstname}} {{getUserDetails.lastname}} </h1>
<edit-profile></edit-profile>
</div>
</template>
<script>
import { mapGetters } from 'vuex';
import EditProfile from './Edit.vue';
export default {
data() {
return {
// data
}
},
created () {
this.fetchData();
},
components: {
EditProfile:EditProfile
},
computed: mapGetters([
'getUserDetails'
]),
methods: {
fetchData: function () {
var _this = this;
// ajax call - then
_this.$store.commit('setData', {
name: 'userDetails',
data: response.data.data.userDetails
});
}
}
}
</script>
Run Code Online (Sandbox Code Playgroud)
这会加载结果并将它们存储在商店中,并且效果很好.
我的商店有这个: …
我只是习惯了PhantomJs,到目前为止它非常酷.
我正在尝试抓取网站并获取有关网站上产品的数据.每个产品页面都会加载产品的默认颜色.单击颜色样本时,它会通过运行函数来交换新颜色.每个可点击的颜色样本元素如下所示:
<input type="image" id="swatch_0" onclick="pPage.getColor(0);" src="http://www.site.com/img50067.jpg">
Run Code Online (Sandbox Code Playgroud)
getColor更新该颜色的缩略图和价格.每个可用颜色(swatch_0,swatch_1等)的id增量以及传递给getColor增量的参数.我想用PhantomJs迭代每种颜色并为每个颜色提取相关数据.
我已经加载了页面,加载了jQuery,并且可以为初始加载的颜色提取数据,但似乎没有任何东西可以让我执行点击事件.
这是我正在尝试的:
page.evalaute(function){
var selection = $('#confirmText').text(); // name of the color
var price = $('#priceText').text(); // price for that color
console.log('Price is: ' + price);
console.log('Selection is: ' + selection);
console.log($('#swatch_1'));
$('#swatch_1').trigger("click");
selection = $('#selectionConfirmText').text();
price = $('#priceText').text();
console.log('Price is: ' + price);
console.log('Selection is: ' + selection);
}
Run Code Online (Sandbox Code Playgroud)
这给了我:
console> Price is: $19.95
console> Selection is: blue
console> [Object Object]
console> TypeError: 'undefined' is not and object // repeating until …Run Code Online (Sandbox Code Playgroud) 我正在尝试使用PhantomJS/CasperJS来抓取网页.我花了最近几天阅读文档,并在网上搜索,但我被困住了.
我正在抓取的页面显示了三个级别的链接 - 年,月和日.当您选择年,月和日时,#count div中会显示一个计数.此外,月份实际上是改变#imageLoad div中图像的输入(我不需要).
<div id="years">
<span class="year">2010</span>
<span class="year">2011</span>
<span class="year">2012</span>
etc...
</div>
<div id="months">
<input type="image" class="month" src="jan_image.png" onclick="changepic('jan')" />
<input type="image" class="month" src="feb_image.png" onclick="changepic('feb')" />
<input type="image" class="month" src="mar_image.png" onclick="changepic('mar')" />
etc...
</div>
<div id="days">
<span class="day">1</span>
<span class="day">2</span>
<span class="day">3</span>
etc...
</div>
<div id="imageLoad">
</div>
<div id="count">
</div>
Run Code Online (Sandbox Code Playgroud)
我正在尝试遍历链接并记录每年,几个月和几天的组合出现的计数.如您所见,月份是改变图片的输入.
我尝试过很多东西.我想做的主要是嵌套循环,循环遍历每组链接,随时点击它们.这是代码(我使用的是jQuery):
casper.start(link);
casper.then(function() {
pageInfo = this.evaluate(function(){
values = [];
for(var y = 0; y < $('#years').length; y++){
year= $('#years span').get(y);
$(year).click();
for(var m = …Run Code Online (Sandbox Code Playgroud) javascript ×2
phantomjs ×2
casperjs ×1
data-binding ×1
jquery ×1
loops ×1
vue-router ×1
vue.js ×1
vuejs2 ×1
vuex ×1