折腾：
【已解决】vuejs中computed中调用methods函数报错：TypeError Cannot read property visibleValue of undefined
期间，希望把此处几个常用的函数，从当前vuejs提取出来，作为公共函数。
那算了，想办法把公共部分的函数提取出来
然后此处computed中调用公共函数
vue.js common method
放到：export default
试试
src/client/xxxClient/src/utils/util.js
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 | export function getRandomIntInclusive(min, max) { // 返回随机值 含最大值，含最小值 min = Math.ceil(min) max = Math.floor(max) console.log('min=%s, max=%s', min, max) const randomValue = Math.floor(Math.random() * (max - min + 1)) + min console.log('randomValue=%s', randomValue) return randomValue}export function visibleValue(isVisible) { console.log('isVisible=%o', isVisible) const curVisibleValue = isVisible ? 'visible' : 'hidden' console.log(`${isVisible} -> ${curVisibleValue}`) return curVisibleValue} |
src/client/xxxClient/src/views/dashboard/index.vue
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 | export default { name: 'Dashboard', timer: '', // isNxmleVisibie: false, data: () => { return { // isNxmleVisibie: true isNxmleVisibie: false // nxmleVisibility: 'hidden' } }, computed: { nxmleVisibility: () => { console.log('into computed nxmleVisibility') console.log('this.isNxmleVisibie=', this.isNxmleVisibie) // return this.visibleValue(this.isNxmleVisibie) return visibleValue(this.isNxmleVisibie) }, methods: { stopUpdate() { clearInterval(this.timer) }, getRandom01() { // return this.getRandomIntInclusive(0, 1) return getRandomIntInclusive(0, 1) }, updateSwitchStatus() { const curRandom = this.getRandom01() console.log('updateSwitch: ', curRandom) } }} |
结果报错，回去继续：
【已解决】vuejs中computed中调用methods函数报错：TypeError Cannot read property visibleValue of undefined
解决了后，最后就可以了。
【总结】
把公共函数放到单独文件里：
src/client/xxxClient/src/utils/util.js
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 | console.log('isVisible=%o', isVisible) const curVisibleValue = isVisible ? 'visible' : 'hidden' console.log(`${isVisible} -> ${curVisibleValue}`) return curVisibleValue}export function getRandomIntInclusive(min, max) { // 返回随机值 含最大值，含最小值 min = Math.ceil(min) max = Math.floor(max) console.log('min=%s, max=%s', min, max) const randomValue = Math.floor(Math.random() * (max - min + 1)) + min console.log('randomValue=%s', randomValue) return randomValue}export function getRandom01() { // return this.getRandomIntInclusive(0, 1) return getRandomIntInclusive(0, 1)} |
然后别的vuejs文件，导入即可使用：
src/client/xxxClient/src/views/dashboard/index.vue
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 | ...import { mapGetters } from 'vuex'import { visibleValue, getRandom01 } from '../../utils/util'export default {... data: () => { return { isNxmleVisibie: false }, computed: { nxmleVisibility: { // getter get: function() { } }, ...mapGetters([ 'name' ]) },... |
即可。
转载请注明：在路上 » 【已解决】vuejs中想办法把公共函数提取出来