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

Vue2.7 setup injectH #12613

Closed
ringgoyao opened this issue Jul 5, 2022 · 6 comments
Closed

Vue2.7 setup injectH #12613

ringgoyao opened this issue Jul 5, 2022 · 6 comments

Comments

@ringgoyao
Copy link

ringgoyao commented Jul 5, 2022

Version

2.7.2

Reproduction link

github.com

Steps to reproduce

npm i
npm run serve

What is expected?

I used @vue/compostion-api with jsx in Vue 2.6 ,
and I solved since issue

[
      '@vue/cli-plugin-babel/preset',
      {
        jsx: {
          compositionAPI: true
        }
      }
]

Now I upgrade to Vue 2.7, I removed @vue/compostion-api plugin , then use @vue/babel-preset-jsx instead

h syntax:

const colunmns=[
{
    label:''date",
    render:(h,row)=>return h('span',row.date)
}
]

What is actually happening?

I hope the jsx code works

const colunmns=[
{
    label:''date",
    render:row=>return <span>{row.date}</span>
}
]
@xu455255849
Copy link

xu455255849 commented Jul 5, 2022

I have a same issues,

// file1
const  columns = [
      {
        label: '客服名称',
        prop: 'name',
      },
      {
        label: '联系方式',
        render: (h: any, scope:  { row: OrgCustomerService}) => {
          return h('span', null, scope.row.contactType === ContractType.Phone ? '电话客服' : '微信客服')
        }
      },

    ]

// table render function

<script>
export default {
  name: 'YxRender',
  functional: true,
  props: {
    scope: Object,
    render: Function,
  },
  render: (h, ctx) => {
    return ctx.props.render ? ctx.props.render(h, ctx.props.scope) : '';
  },
};
</script>

this code in @vue/composition-api is work,,but update v2.7 is not work, throw error :
image

@iceprosurface
Copy link

see vuejs/jsx-vue2#285

@ringgoyao
Copy link
Author

ringgoyao commented Jul 6, 2022

see vuejs/jsx-vue2#285
@iceprosurface
hi,thks for your reply, now what should I update ?

    [
      '@vue/babel-preset-jsx',
      {
        injectH: false,
        importSource: 'source'
      }
    ]

you menu like this?
But @vue/babel-preset-jsx version stll work at 1.2.4 in npm

@iceprosurface
Copy link

@ringgoyao
This was not released.Might as well try following code.

import { h } from 'vue'
const colunmns=[
{
    label:''date",
    render:(_,row)=>return h('span',row.date)
}
]

@ringgoyao
Copy link
Author

@iceprosurface
yes, h can work in fact , I will try after it release

@sodatea
Copy link
Member

sodatea commented Jul 6, 2022

Fixed in https://github.com/vuejs/jsx-vue2/releases/tag/v1.3.0
Note that you still need the explicit compositionAPI: true config to opt-in to this feature.

@sodatea sodatea closed this as completed Jul 6, 2022
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

Successfully merging a pull request may close this issue.

4 participants