Question

我想从下拉列表中选择一个选项后立即禁用选择器（我不想选择任何东西）。这是选择器，

    // Account UI
    function accountUI(str) {
        // Parse MOTD for use
        var motd = str.match( /<motd>[^<>]*?<\/motd>/igm );

        // Clean un-needed spaces & tags
        var motd_clean = motd[0];
        motd_clean = motd_clean.replace("<motd>", "");
        motd_clean = motd_clean.replace("</motd>", "");
        motd_clean = motd_clean.replace(/[\r]+/g, '');
        motd_clean = $.trim(motd_clean);

        // Create textarea for MOTD
        $("#can_wrapper").append('<textarea id="motd" name="motd" disabled>' + motd_clean + '</textarea>');

        // Create blue background for players
        ctx.fillStyle = "#333399";
        ctx.fillRect(2, 255, 596, 181);

        // Parse player names for use
        var players = str.match( /<players>([\s\S]*?)<\/players>/m );
        var players = players[0];
        var item = str.match( /<item([\s\S]*?)>/mg );

        // For every player run iteration
        var image = [];
        for (var i = 0; i < item.length; ++i) {
            // Position for players on account screen
            if(i == 0){ var pos = "61px";var iter = 0;}
            if(i == 1){ var pos = "168px";var iter = 1;}
            if(i == 2){ var pos = "275px";var iter = 2;}
            console.log(i);
            console.log("1 -> " + iter);
            // Gets player name from string
            var player = item[i].match( /([A-Z])\w+/g );

            // Create player div for mouse interaction
            var player_el = $('<div class="cursor player" id="player'+ player +'"></div>');
            $("#can_wrapper").append(player_el);
            $("#player"+ player).css({"position": "absolute", "height": "50px", "width": "50px", "left": ""+ pos +"", "top": "271px", "cursor": "grab", "cursor": "-webkit-grab"});

            // Get player name for hover action
            var player_name_el = player;
            document.styleSheets[0].addRule('#player'+ player +':hover::after','content: "'+player_name_el+'";');

            /**
             * Promisify loading an image
             * @param {String} imagePath The web location of the image
             * @returns {Promise} A Promise that will resolve to an Image
             */
            function loadImage(imagePath) {
                return new Promise((resolve, reject) => {
                    image[i] = new Image();
                    image[i].addEventListener("load", () => {
                        resolve(image[i]);
                    });
                    image[i].addEventListener("error", (err) => {
                        reject(err);
                    });
                    image[i].src = 'https://www.example.com/interface/images/body/' + imagePath;
                });
            }

            var imageSources = ['v1456.png', 'vbody0.png','vhead14.png','v1960.png','v578.png','v1221.png', 'v3063.png']; // url and order

            Promise
                .all(imageSources.map(ii => loadImage(ii)))
                .then((images) => {
                    images.forEach((image[i]) => {
                        if(iter == 0){ ctx.drawImage(image[i], 60, 270);}
                        if(iter == 1){ ctx.drawImage(image[i], 80, 270);}
                        if(iter == 2){ ctx.drawImage(image[i], 100, 270);}
                        console.log(iter);
                    });
                }).catch((err) => {
                    console.error(err);
                });

        }
    }

如果找到解决方案，将对您有很大帮助！

Answer 1

您可以使用启用的props，enabled = {this.state.enabled}，当用户选择日期时，调用setState并将启用状态切换为false。请记住，启用的道具仅适用于android。这是一个例子：

constructor(props) {
    super(props);
    this.state = { 
        enabled: true // Enabled by default , you can change it
     };

// inside your updateState function call : this.setState({enabled:false})
// if you dont already defined updateState
// updateState = () =>{ this.setState({enabled:false})
<View style={editProfileStyle.pickerView}>
            <Picker
              style={{
                ...Platform.select({
                  android: {
                    color: "#000"
                  }
                })
              }}
              enabled={this.state.enabled}
              selectedValue={this.state.Qualification}
              onValueChange={this.updateState}
              mode="dropdown"
              itemStyle={{ height: 80, color: "#000000" }}
            >
                {this.state.options.map((item, index) => {
                    return <Picker.Item value={item} key={index} label={item} />;
                })}
            </Picker>
          </View>

选择一个选项后如何禁用本机选择器

1 个答案: