![PyPI Now Supports iOS and Android Wheels for Mobile Python Development](https://cdn.sanity.io/images/cgdhsj6q/production/96416c872705517a6a65ad9646ce3e7caef623a0-1024x1024.webp?w=400&fit=max&auto=format)
Security News
PyPI Now Supports iOS and Android Wheels for Mobile Python Development
PyPI now supports iOS and Android wheels, making it easier for Python developers to distribute mobile packages.
@ant-design-vue/babel-plugin-jsx
Advanced tools
To add Vue JSX support.
English | 简体中文
Install the plugin with:
npm install @ant-design-vue/babel-plugin-jsx -D
Then add the plugin to .babelrc:
{
"plugins": ["@ant-design-vue/babel-plugin-jsx"]
}
Type: boolean
Default: false
transform on: { click: xx }
to onClick: xxx
Type: boolean
Default: false
enable optimization or not. It's not recommended to enable it If you are not familiar with Vue 3.
Type: (tag: string) => boolean
Default: undefined
configuring custom elements
functional component
const App = () => <div></div>;
with render
const App = {
render() {
return <div>Vue 3.0</div>;
}
};
const App = defineComponent(() => {
const count = ref(0);
const inc = () => {
count.value++;
};
return () => (
<div onClick={inc}>
{count.value}
</div>
);
});
import { withModifiers } from 'vue';
const App = () => {
const count = ref(0);
const inc = () => {
count.value++;
};
return () => (
<div onClick={withModifiers(inc, ['self'])}>
{count.value}
</div>
);
}
Fragment
const App = () => (
<>
<span>I'm</span>
<span>Fragment</span>
</>
);
const App = () => <input type="email" />;
with a dynamic binding:
const placeholderText = 'email';
const App = () => (
<input
type="email"
placeholder={placeholderText}
/>
);
v-show
const App = {
data() {
return { visible: true };
},
render() {
return <input v-show={this.visible} />;
},
};
v-model
Note: You should pass the second param as string for using
arg
.
<input v-model={val} />
<input v-model={[val, ['trim']]} />
<A v-model={[val, 'foo', ['bar']]} />
Will compile to:
h(A, {
'foo': val,
"fooModifiers": {
"bar": true
},
"onUpdate:foo": $event => val = $event
})
custom directive
const App = {
directives: { custom: customDirective },
setup() {
return () => (
<a
v-custom={[val, 'arg', ['a', 'b']]}
/>
);
},
};
const App = {
setup() {
const slots = {
default: () => <div>A</div>,
foo: () => <span>B</span>
};
return () => <A v-slots={slots} />;
}
};
![]() Ant Design Vue |
![]() Vant |
This repo is only compatible with:
1.0.0-rc.1
2020-07-29
v-html
and v-text
isCustomElement
compatibleProps
usePatchFlag
as optimize
FAQs
Babel plugin for Vue 3.0 JSX
The npm package @ant-design-vue/babel-plugin-jsx receives a total of 2,331 weekly downloads. As such, @ant-design-vue/babel-plugin-jsx popularity was classified as popular.
We found that @ant-design-vue/babel-plugin-jsx demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 4 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
PyPI now supports iOS and Android wheels, making it easier for Python developers to distribute mobile packages.
Security News
Create React App is officially deprecated due to React 19 issues and lack of maintenance—developers should switch to Vite or other modern alternatives.
Security News
Oracle seeks to dismiss fraud claims in the JavaScript trademark dispute, delaying the case and avoiding questions about its right to the name.