Skip to content

chengzhuo5/babel-plugin-react-directives

 
 

Repository files navigation

@minar-kotonoha/babel-plugin-react-directives

原 git 项目:https://github.com/peakchen90/babel-plugin-react-directives/

本项目是基于原项目的二次开发,配合@minar-kotonoha/vue-native-core支持了 v-model 指令。原项目针对 class 组件的 v-model 指令重命名为 v-model-class。

如果不使用@minar-kotonoha/vue-native-core,此项目也能正常运行。

使用说明

// babel.config.js
{
  plugins: [
    [
      "@minar-kotonoha/babel-plugin-react-directives",
      {
        prefix: "v",
        pragmaType: "React"
      }
    ]
  ];
}
// Vue组件
import React from "react";
import { constructor } from "@minar-kotonoha/vue-native-core";

export default constructor({
  data() {
    return {
      input: "hhh"
    };
  },
  render() {
    return (
      <div>
        <div>{this.input}</div>
        <input v-model={this.input} />
      </div>
    );
  }
});
// React-class组件
import React, { Component } from "react";
class Test extends Component {
  state = { data: "" };
  render() {
    return (
      <div>
        <div>{this.state.data}</div>
        <input v-model-class={this.state.data} />
      </div>
    );
  }
}

About

A babel plugin that provides some directives for react(JSX), similar to directives of vue.

Resources

License

Stars

Watchers

Forks

Packages

No packages published

Languages

  • JavaScript 100.0%