how to add multiple hashtags in a string?

Viewed 21

hi i have a textarea where user write a string and when user type # then i want to show the similar hashtags list and user can choose similar hashtag but now the problem is when user write # for the first time than its is working properly bt when user type #for the second time the code doesn't work. can somebody tell how can i show similar tags whenever user types # or if edit the already choosed hashtag from similar hashtag list

My Code :

code to show similar tags when user type #:

const setMessage = async (evt) => {
    setMsg(evt.target.value);
    let text = evt.target.value;
    if(msg.includes("#") && msg != ""){
        var index = msg.indexOf("#");
    setUserWrittenTag(msg.substr(index))
        await fetch(`/similartags`, {
                method:"POST",
                headers:{
                    "Content-Type":"application/json"
                },
                body: JSON.stringify({
                    data:msg.substr(index)
                })
            })
            .then(res => res.json())
            .then(data => {
                setSearchedItemsResult(searchItems => [data])
                //this.setState({ searchItems: temp });
            });
    }

}

code to get selected hashtag:

const getSelectedTag = async(tagname) => {
    console.log(tagname)
    console.log(userWrittenTag);
    setMsg(msg.replace(userWrittenTag,tagname))
    setSearchedItemsResult([])
}

code for textarea:

<textarea type = "text" id = "autocomplete" className = "state_block" name = "name" onChange={setMessage} onKeyUp={setMessage} value={msg}> </textarea>

code for tags list:

{
                        SearchedItemsResult.length > 0 && ( <ul className = "list-group main-screen-filter" > {
                                SearchedItemsResult[0].data.map((item, idx) => ( <li className = {
                                        "list-group-item"
                                    }
                                    key = { idx }
                                    onClick = {
                                        ()=>{getSelectedTag(item.name)}
                                    }
                                    > { item.name } </li>
                                ))
                            } </ul>
                        )
                    }
0 Answers
Related