Needlessly Postulating Minds

    react-cascader

    1.0.1 • Public • Published

    Useage

    install

    npm i react-cascader -S
    or
    yarn add react-cascader
    import React, { useState } from "react";
    import { SelectMultiple } from "tea-component";
    
    import { CascaderProvider, useCascader } from "react-cascader";
    
    const mutiOptions = [
      { value: "gz", text: "瓜子", tooltip: "百煮入味香" },
      {
        value: "hs",
        text: "花生",
        disabled: true,
        tooltip: "花生已售罄",
      },
      { value: "bmf", text: "爆米花", tooltip: "焦糖味" },
      { value: "kl", text: "可乐", tooltip: "肥宅快乐水" },
      { value: "pj", text: "啤酒" },
      { value: "kqs", text: "矿泉水" },
      { value: "bbz", text: "八宝粥" },
    ]
    
    export default function Index() {
      const [options, setOptions] = useState(mutiOptions);
    
      const SelectMultipleCascader = useCascader(SelectMultiple);
    
      function onChange(value, index) {
        console.log("Change: ", value, index)
      }
    
      // 关联的数量,前一个的数据会影响后一个数据
      const items = [1, 2, 3, 4, 5];
      return (
        <CascaderProvider options={options}>
          {
            (provider) => (
              items.map((index) => (
                <SelectMultipleCascader
                  key={index}
                  index={index}
                  staging={false}
                  onChange={onChange}
                  appearance="button"
                  {...provider.props}
                />
              )
              )
            )
          }
        </CascaderProvider>
      )
    }

    props

    Name Description
    index string (Cascader index)

    Install

    npm i react-cascader

    DownloadsWeekly Downloads

    3

    Version

    1.0.1

    License

    ISC

    Unpacked Size

    531 kB

    Total Files

    30

    Last publish

    Collaborators

    • ppdesign