如何用Uniapp设置input的光标位置

使用Uniapp开发应用时，常会遇到需要设置input输入框光标位置的需求，比如设置在输入框内容的末尾位置。本文将介绍如何通过Uniapp实现输入框光标位置的设置，包括以下内容：

1. 获取input输入框元素

2. 设置输入框光标位置

1. 获取input输入框元素

要设置input输入框光标位置，首先需要获取该输入框的元素。在Uniapp中，可以使用uni.createSelectorQuery方法来获取元素。

// 获取input输入框元素
uni.createSelectorQuery().select('#input').fields({
    node: true,
    size: true,
    scrollOffset: true,
    properties: ['value']
},function(res){
    // 获取到的元素信息
    console.log(res)
}).exec();

上述代码中，使用选择器#input获取了id为input的元素，并使用fields方法获取该元素的节点信息、大小、滚动偏移量以及属性值。获取元素信息后，就可以对输入框进行进一步操作。

2. 设置输入框光标位置

要设置input输入框光标位置，可以通过设置输入框的selectionStart和selectionEnd属性来实现。这两个属性分别表示输入框内容的光标起始位置和结束位置。

// 获取input输入框元素
uni.createSelectorQuery().select('#input').fields({
    node: true
},function(res){
    // 获取到的input元素
    const input = res.node;
    
    // 设置输入框光标位置
    input.selectionStart = input.selectionEnd = input.value.length;
}).exec();

上述代码中，设置输入框的selectionStart和selectionEnd属性为输入框内容的长度，这样就可以将光标设置到输入框内容的末尾位置。

注意： 在设置光标位置时，需要保证该输入框已经渲染完成，否则无法获取到该输入框的节点信息。可以在页面加载完成后再进行操作，或者在使用uni.createSelectorQuery方法时指定节点的渲染完成事件。

以上就是如何使用Uniapp设置input输入框的光标位置的方法。通过获取输入框元素并设置selectionStart和selectionEnd属性，就可以实现将光标设置到输入框内容的末尾位置。