我正在编写一个React.js应用程序,我想在其中使用Linkreact-router 包中的组件,以便有条件地将用户重定向到另一个页面。如果某些条件不成立,我将to道具设置为空字符串,该字符串有效并且不会导致页面重新加载并且页面保持在与原来完全相同的位置。但我想知道这是否是最佳实践?
这是我的解决方案:
import { Link } from 'react-router';
<Link to={condition === true ? '/some/other/url' : ''}>
<div>
my content
</div>
</Link>
Run Code Online (Sandbox Code Playgroud)
我在文档中没有看到有关空字符串输入的任何内容。
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600|Lato|Montserrat&subset=greek);
body
{
background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
font-family:"Helvetica Neue", Helvetica, Sans-serif;
}
.matur-image-container {
overflow-x: visible;
overflow-y: visible;
width: 100%;
color: darkred;
background-color: white;
margin-top: -5px;
padding-top: 10px;
padding-bottom: 10px;
border-radius: 30px;
font-size: 20px;
}
.food-link {
margin-right: 0px;
padding-top: 0px;
padding-right: 0px;
padding-left: 0px;
background-image: none;
background-position: 0% 0%;
}
.cartbutton
{
border: 1px solid black;
border-radius: 5px;
background-color: lightblue;
text-decoration: none;
padding: 10px;
margin-bottom: 5px;
}
.cartbutton:hover
{
background-color: #528881;
transition: all .30s ease;
} …Run Code Online (Sandbox Code Playgroud)如果我想向锚标记添加死链接,因为我想使用 (click) 代替,那么我可以使用[routerLink]=""或href="javascript:void(0);"。两者都有相同的效果,我认为浏览器兼容性没有区别。
更喜欢使用哪一种?有什么区别吗?
目标 我正在尝试在模态中进行编辑。单击保存后,我希望将更改保存到数据库,模式关闭并在同一页面上显示结果。
结果当前代码打开模态,将数据保存在数据库中,关闭模态,刷新页面,简而言之,它满足了我的需求。
**挑战 当结果刷新时,URL 在末尾添加了一个 #,这会干扰我的侧面板,使所有链接都打开。这是它的样子http://127.0.0.1:8000/todolists# **
这是我的代码的样子
控制器
public function editTodo(request $request){
$todo = Todo::find ($request->id);
$todo->item = $request->item;
$todo->description = $request->description;
$todo->save();
return response()->json($todo);
}
Run Code Online (Sandbox Code Playgroud)
View 是一个索引页面,javacript 位于页面底部,为简单起见,我将代码分解为 3 个部分(HTML 表、HTML 模态和 JavaScript)。
视图 - HTML 表格
<div class="row">
<div class="table table-responsive">
<table class="table table-bordered" id="table">
<tr>
<th width="150px">No</th>
<th>item</th>
<th>description</th>
<th>Create At</th>
<th class="text-center" width="150px">
<a href="#" class="create-modal btn btn-success btn-sm">
<i class="glyphicon glyphicon-plus"></i>
</a>
</th>
</tr>
{{ csrf_field() }}
<?php $no=1; ?>
@foreach ($todo …Run Code Online (Sandbox Code Playgroud) 除了明显阻止链接被点击(和javascript:void(0);)和undefined许多javascript预编译语言的定义,如coffeescript(在哪里undefined成为void 0) - >该void功能还可用于什么?
实用链接:MDN页面void
对于因为之前被问过而被投票的好人:我的问题不是隐含的事件参数.我不知道.事件参数是答案,而不是问题.
function myEventHandler() {
var eventSrcType=(event.srcElement) ? event.srcElement.type : 'type undefined';
alert(eventSrcType);
}
Run Code Online (Sandbox Code Playgroud)
当用户点击图像("onclick")时,例如,调用该函数
<a href="javascript:void(0)" onclick="myEventHandler();">
显然分配有问题,因为alert它永远不会被执行.这有什么不对?
(我试过了window.event,但是Dreamweaver没有暗示它event是一个成员window.无论如何,它也不起作用)
编辑
所有答案暗示隐式传递event.所以我添加了作为函数的参数(不带参数调用),
function myEventHandler(event) {
var eventSrcType=(event.srcElement) ? event.srcElement.type : 'type undefined';
alert(eventSrcType);
}
Run Code Online (Sandbox Code Playgroud)
但我仍然没有得到警报.
this作为参数传递显示"type undefined",但我希望这里的锚类型.