解决vue组件props传值对象获取不到的问题

先说问题，父组件利用props向子组件传值，浏览器

console

有这个值，但是获取不到内部的属性，困了我3个小时，真的

personal

console

以下为原代码

1、homevue（父组件）--personal是被传的参数

<!--子组件-->

<form-picker

class="form-picker"

:personal="personal"

>

</form-picker>

export

default

{

data(){

return{

personal:{

state:'',////判断是修改状态，还是新增状态

add/edit

data:[]

}

}

},

mounted(){

this$apipersonalsearchPersonalInfo(thisuserInfouserId)then((res)=>{

thispersonaldata

=

resdatadata

//这里给personal对象赋值接口传来的数据

})

},

}

2、formPicker

（子组件）

--接收personal

export

default

{

props:['active','personal'],

mounted(){

consolelog(149,thispersonal)

consolelog(150,thispersonalstate)

}

}

运行结果

明明149行有

state

值，150行输出却没有了,是不是超级奇怪

后面经过大佬的讲解，其实浏览器consolelog也是应该没有的

所以，其实我们子组件一开始根本就没有取到这个personal这个对象。

3、解决方法--使用watch

父组件

export

default

{

data(){

return{

personal:{

state:'',////判断是修改状态，还是新增状态

add/edit

data:[]

}

}

},

mounted(){

this$apipersonalsearchPersonalInfo(thisuserInfouserId)then((res)=>{

//thispersonaldata

=

resdatadata

//这里给personal对象赋值接口传来的数据

//使用以下方法重新赋值，上面方法watch监听不到，具体什么原因，我也不清楚，知道的告知我！谢谢

thispersonal

=

{

data:

resdatadata,

state:

'edit'

}

})

},

}

接下来子组件就能

watch

到

personal

了

子组件

watch:{

personal(newValue,oldValue){

consolelog(181,newValue)

},

/

输出

{

data:

resdatadata,

state:

'edit'

}

/

}

总结

以上所述是小编给大家介绍的解决vue组件props传值对象获取不到的问题,希望对大家有所帮助，如果大家有任何疑问请给我留言，小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持！

如果你觉得本文对你有帮助，欢迎转载，烦请注明出处，谢谢！

您可能感兴趣的文章:vue20

子组件改变props值,并向父组件传值的方法详解vue父子组件间传值(props)vue之父子组件间通信实例讲解(props、$ref、$emit)vue组件中使用props传递数据的实例详解vue父组件向子组件(props)传递数据的方法vue父组件通过props如何向子组件传递方法详解详解vue2父组件传递props异步数据到子组件的问题

不知道你用的是不是jquery ui的 datepicker 如果去 参数中 有一个onSelect的参数，这个就是设置你选中日期是触发的事件。

onSelect: null, // Define a callback function when a date is selected

这个是源码中的片段。

把JSP中form表单的代码贴上来。

用的是Struts2吗？

哥们啊，你不会用“追问”吗？搞的我总要改回答。

你的<s:if test="#printMessage == \"View\""></s:if>起什么作用啊？初始没有值，加不加这个if你也没值显示啊

你是不是不会提问啊？你不追问我怎么知道哪些是你又写出的东西啊？？连个层次都没有。你前面是不是还有代码啊？我要这个form表单部分的所有代码

首先，我们将这款日期控件下载下来。百度bootstrap日期控件即可。

bootstrap的日期控件

将下载好的日期控件的css、js引入自己的文件中。

在这里需要引入的文件有：

bootstrapmincss（含有bootstrap 所有css）

bootstrap-datetimepickermincss（重要，这就是日期控件所需的样式表）

jquery-183minjs（其他版本的jquery也可以）

bootstrapminjs（含有bootstrap 所有js）

bootstrap-datetimepickerjs（重要，这就是日期控件所需的js）

locales/bootstrap-datetimepickerfrjs（重要，这里是日期控件初始值）

bootstrap的日期控件

bootstrap的日期控件

bootstrap的日期控件

将所有文件引入完成后，就开始设置日期控件吧。

以上就是关于解决vue组件props传值对象获取不到的问题全部的内容，包括:解决vue组件props传值对象获取不到的问题、jquery 怎么获取日期控件值改变事件、JAVA开发，进入修改页面的时候能获取到CreateDate、CreateUser这两个字段的值，点保存后这两个值就为NULL等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！