反应世界的新手,所以要好看:-)我想把道具传递给像<a href={this.props.text} </a>
这样的链接,但我想将其转换为“有效”链接,这样如果我通过像“新反应”这样的动态内容会转换为/new-to-react
。
我该如何解决这个问题呢?我找了React组件但什么都没找到。
有道理吗?任何意见都非常感谢,谢谢。
答案 0 :(得分:2)
您可以使用此实用程序功能将文本更改为slug。
function slugify(text){
return text.toString().toLowerCase()
.replace(/\s+/g, '-') // Replace spaces with -
.replace(/[^\w\-]+/g, '') // Remove all non-word chars
.replace(/\-\-+/g, '-') // Replace multiple - with single -
.replace(/^-+/, '') // Trim - from start of text
.replace(/-+$/, ''); // Trim - from end of text
}
因此,如果你用slugify
包装你的this.props.text,那么你将获得适当的slu ..
例如:
如果this.props.text
为'Hello World'
,{slugify(this.props.text)}
将为'hello-world'