vue2+jsx

最新推荐文章于 2024-08-02 15:41:03 发布

一个低保户

最新推荐文章于 2024-08-02 15:41:03 发布

阅读量408

点赞数

文章标签： vue jsx

本文链接：https://blog.csdn.net/weixin_44294593/article/details/114953833

版权

本文将探讨如何在Vue2项目中引入并利用JSX语法，通过实例解析jsx在模板渲染、组件构建等方面的优势，帮助开发者提升开发效率。

摘要由CSDN通过智能技术生成

// babel.config.js
module.exports = {
  presets: ["@vue/babel-preset-app"],//没有的话jsx语法不行
};

// *.vue
<script>
export default {
  name: "jsx",
  data() {
    return {
      count: 2,
    };
  },
  methods: {
    getCount() {
      console.log(this.count);// 2
    },
  },
  render() {
    const { count } = this;
    return (
      <div>
        <div class="hello">
          <h1>{count} --- use jsx</h1>
        </div>
      </div>
    );
  },
};
</script>