标签: mention

如何在React-native中的TextInput中实现@mention.

我已经尝试了这种反应本地提及但它不再维护了.有很多样式问题和回调问题.

我想要的是在textInput中显示这样的自定义视图.

点击列表后我想显示如下:

到目前为止,我能够实现:

当我在TextInput中键入'@'时,会出现用户列表.

当我点击用户时,我在TextInput中获得用户名

码

   renderSuggestionsRow() {
      return this.props.stackUsers.map((item, index) => {
         return (
            <TouchableOpacity key={`index-${index}`} onPress={() => this.onSuggestionTap(item.label)}>
               <View style={styles.suggestionsRowContainer}>
                  <View style={styles.userIconBox}>
                     <Text style={styles.usernameInitials}>{!!item.label && item.label.substring(0, 2).toUpperCase()}</Text>
                  </View>
                  <View style={styles.userDetailsBox}>
                     <Text style={styles.displayNameText}>{item.label}</Text>
                     <Text style={styles.usernameText}>@{item.label}</Text>
                  </View>
               </View>
            </TouchableOpacity>
         )
      });
   }

   onSuggestionTap(username) {
      this.setState({
         comment: this.state.comment.slice(0, this.state.comment.indexOf('@')) + '#'+username,
         active: false
      });
   }

   handleChatText(value) {
      if(value.includes('@')) {
         if(value.match(/@/g).length > 0) {
            this.setState({active: true});
         }
      } else {
         this.setState({active: false});
      }
      this.setState({comment: value});
   }
render() { …

我正在制作一个机器人，我正在尝试 Ping 某个角色。这是相关的代码：

let msga = msg.author;
msg.channel.send("@NES Found one!! " + msga);

@NES 是我试图 ping/提及的​​角色。

我试图在draft-js中使用提及插件与Browserify一起工作.这是因为我们的应用程序是使用Browserify构建的.

这是关于这个插件:https://www.draft-js-plugins.com/plugin/mention

在示例中,他们使用Webpack,并使用导入.

我用require.所以我的代码示例是:

var React       = require('react'),
    Draft       = require('draft-js'),
    Immutable   = require('immutable'),
    Editor      = require('draft-js-plugins-editor'),
    Mention     = require('draft-js-mention-plugin');

var mentionPlugin = Mention.createMentionPlugin();
var MentionSuggestions = mentionPlugin.MentionSuggestions;
var plugins = [mentionPlugin];

var Editor = React.createClass({
    // Code
});

我不使用ES6表示法.有人知道我做错了什么吗？

任何人都使用@mentions实现TextInput,就像它在脸书和推特中的表现一样？

我试过https://github.com/harshq/react-native-mentions但是没有处理删除.

如何在不知道 LinkedIn UGC 帖子上成员/组织的 URN 的情况下实现提及。文件说明您需要提供您提到的成员/组织的 URN。是否有人实施了 LinkedIn 提及。

https://docs.microsoft.com/en-us/linkedin/marketing/integrations/community-management/shares/ugc-post-api

您能帮我如何将其位置从下到上更改吗？我想在文本顶部而不是底部显示提及列表。关于表情符号列表的同样问题。

示例链接。

我有用户反馈板，并且我已经向网站上的其他用户实施了@提及。一旦其他用户被@提及，它就会显示在他们的收件箱中，并附有一条通知，表明他们“在 ___ 帖子上被@提及”。

当帖子显示时，它当前将 @mention 显示为纯文本 - 如下所示：

"Hi @JoeBlow, nice work today..."

然而我想做的是<span>在 @mention 名称周围放置一个元素，使其变为蓝色或以某种方式使 @mention 脱颖而出 - 如：

Hi <span style="font-color:blue">@JoeBlow</span>, nice work today..."

我不熟悉正则表达式，我什至不确定这是否是正确的方法。

我不认为这是 CSS 的事情，并且必须是：

a) 通过 PHP 即时吐出
b) 使用一点 jQuery 进行处理（最好）

我可以简单地找到str_replace()每个用户名并@尝试进行一些疯狂的替换文本移动，但问题是每个用户名不是固定长度。那么我如何才能知道每个用户名需要用<span>元素中包含的字符串替换多长时间呢？

不管怎样，这听起来像是一个肮脏的黑客行为。

我认为现在已经为此制作了一些插件来实现@mentioning 或#hashtaging。

或者可能必须定制。

任何想法，将不胜感激。