Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

hbx模板不能使用官方的renderjs #164

Open
LeeYuze opened this issue Aug 27, 2024 · 4 comments
Open

hbx模板不能使用官方的renderjs #164

LeeYuze opened this issue Aug 27, 2024 · 4 comments

Comments

@LeeYuze
Copy link

LeeYuze commented Aug 27, 2024

Bug report(问题描述)

pnpm create unibest my-project -t hbx-base # hbx的base模板,使用这个命令生成的模板,不能用官方的renderjs

hb编辑器控制台报错,TypeError: e.undefined is not a function,我用hb创建的空白模板实现了下面的代码,没有问题,只有咱们的unibest模板不行

Steps to reproduce(问题复现步骤)

<!-- 使用 type="home" 属性设置首页,其他页面不需要设置,默认为page;推荐使用json5,更强大,且允许注释 -->
<route lang="json5" type="home">
{
  layout: 'default',
  style: {
    navigationBarTitleText: '首页',
  },
}
</route>

<template>
  <view class="renderWrap">
    <view>
      <button type="primary" @click="renderJS.sendData">视图层 发送数据到 逻辑层1</button>

      <button class="margin-top-md margin-bottom-md" type="warn" @click="changeMsg">
        逻辑层 修改 msg 值
      </button>

      <button type="primary" @click="renderJS.renderMsg">视图层 修改 逻辑层值</button>

      <view
        class="margin-top-md margin-bottom-md text-center"
        :msg="msg"
        :change:msg="renderJS.receiveMsg"
      >
        {{ msg }}
      </view>
    </view>
  </view>
</template>

<script module="renderJS" lang="renderjs">
export default {
	data() {
		return {
			name: '我是renderjs module!',
			message: ''
		}
	},
	methods: {
		renderMsg(event, ownerInstance) {
			// 调用 Model 层的 renderClick方法,进行传值
			ownerInstance.callMethod('renderClick', {
				value: 'renderjs 向 Model 层传递数据,并修改了 msg 值'
			})
		},
		// 接收 逻辑层发送的数据
		receiveMsg(newValue, oldValue, ownerVm, vm) {
			console.log('监听 msg 值:', newValue, oldValue)
		},
		// 发送数据到 逻辑层
		sendData(e, ownerVm) {
			ownerVm.callMethod('receiveRenderSendData', this.name)
		}
	}
}
</script>

<script>
export default {
  data() {
    return {
      msg: '我是Model层的msg',
    }
  },
  methods: {
    // 触发逻辑层,renderjs 接收数据
    changeMsg() {
      this.msg = '修改 msg 值,并执行 receiveMsg 方法'
    },
    // 接收 renderjs 发送的数据
    receiveRenderSendData(val) {
      this.msg = `Model 接收 View层 值:${val}`
    },
    //接收 renderjs 传递数据
    renderClick(e) {
      this.msg = e.value
    },
  },
}
</script>

minimal reproduction(最小可还原代码)

新建模板,复制上面的代码直接替换index.vue就行,然后编译运行

@elarbor
Copy link

elarbor commented Sep 4, 2024

pnpm真不如用npm

@QingYiShiDeCha
Copy link

兄虎解决了吗

@liumingliangweb
Copy link

兄弟解决了吗 遇到同样的问题

@liumingliangweb
Copy link

兄虎解决了吗

解决了吗

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants