Vue computed使用方法及使用原因总结
1.通过computed可以对{{}}里的数据进行处理。当然对数据进一步处理,通过写method方法也可以达到,为什么要通过computed的方式呢?这是因为computed的方法比method节约资源。 计算属性是基于它们的响应式依赖进行缓存的。只在相关响应式依赖发生改变时它们才会重新求值。这就意味着只要 message 还没有发生改变,多次访问 test计算属性会立即返回之前的计算结果,而不必
·
1.通过computed可以对{{}}里的数据进行处理。当然对数据进一步处理,通过写method方法也可以达到,为什么要通过computed的方式呢?这是因为computed的方法比method节约资源。 计算属性是基于它们的响应式依赖进行缓存的。只在相关响应式依赖发生改变时它们才会重新求值。这就意味着只要 message 还没有发生改变,多次访问 test计算属性会立即返回之前的计算结果,而不必再次执行函数。
<div>{{test}}</div>
<script>
export default{
data: {
return{
message:'1234'
}
}
computed: {
test: function() {
return this.message.join('')
}
}
}
</script>
2.如果想要传参给computed进行操作,通过闭包的写法
<div>{{test(param)}}</div>
<script>
export default{
data: {
return{
message:'1234'
}
}
computed: {
test: function() {
return param //此时的param就是传的参数,原样返回
}
test: function() {
return function(param) { //通过闭包的形式,把出参再当作入参传到function里
//.....写对param的操作
var test = param
return test
}
}
}
}
</script>
更多推荐
已为社区贡献2条内容
所有评论(0)