关于进入管理页遇到的问题

来源:6-9 店铺管理页面的前端开发

mokone_ark

2019-01-07

1、在设置css的时候,自已设置的margin-bottom在第一次访问的页面的时候不起作用,要手动刷新一次页面才生效。
我怀疑是sui的link样式加载太慢,会把自己设置的样式覆盖,加!important也不起作用。

div.row div {
	margin-bottom: .5em !important;
}

最后很无奈的写到了行内样式里才解决。。。。

<div class="col-50" style="margin-bottom: .5rem">
	<a id="shop-info" class="button button-big button-fill">店铺信息</a>
</div>

2、在js 进行初始化时也是一样的情况,第一次进入页面并不调用

$(function() {
	init();
});

导致href里没有url,手动再去点一次刷新才会触发(蒙蔽。。。。)
图片描述
这里并没有加载到管理页的js

var isInfo = function(status, id) {
	if(status == 1) {
		var url = '/o2o/shop/page/management?id=' + id;
		return '<a onclick="window.location.href =\''+ url +'\'">查看</a>';
	} else {
		return '<a style="color: #ccc">查看</a>';
	}
}

之后用了这种办法。。。解决了,但是之后每一次类似的跳转都要这么写感觉挺麻烦的,想知道原因是什么。。

最后,为什么不用jsp来写啊,这才一个模块就已经写了N个接口了。。。唉。。。

写回答

1回答

翔仔

2019-01-08

同学好,感觉还是哪里写得不对导致的问题,应该不是sui慢,而且加载的东西比较少,理应sui更不存在这样的问题,不然大家都报了。如果同学是因为远程访问sui库导致的问题,建议直接去访问的链接里下载相关的库代码放到前端来直接使用。

同时,同学可以设置下断点看看你的方法为什么在首次加载的时候不会被触发,我这边没有这样的问题。

并且,我们的网页是教会大家用ajax的方式局部刷新,并灵活调用后台的API(即便换成别的语言的后端也能通过这种方式去调用)。所以用jsp和html效果都是一样的,jsp还和java有过多的耦合,在公司级别的开发里,如果是分为前端后端开发人员,那么前端往往都会是h5+前端框架的形式通过api和后端交互,所以也能提前锻炼一下模拟下真实场景。此外,我们的接口并不多,这个比起真实开发少多了,同学如果能够站在设计的角度去看待这些API,思路就会清晰了。

最后,希望同学不要怕烦乱,要从烦乱中抽出主要逻辑思路去理解问题:)加油

最后,附上代码,同学可以参考一下

$(function() {
	getlist();
	function getlist(e) {
		$.ajax({
			url : "/o2o/shopadmin/getshoplist",
			type : "get",
			dataType : "json",
			success : function(data) {
				if (data.success) {
					handleList(data.shopList);
					handleUser(data.user);
				}
			}
		});
	}
	function handleUser(data) {
		$('#user-name').text(data.name);
	}

	function handleList(data) {
		var html = '';
		data.map(function(item, index) {
			html += '<div class="row row-shop"><div class="col-40">'
					+ item.shopName + '</div><div class="col-40">'
					+ shopStatus(item.enableStatus)
					+ '</div><div class="col-20">'
					+ goShop(item.enableStatus, item.shopId) + '</div></div>';

		});
		$('.shop-wrap').html(html);
	}

	function shopStatus(status) {
		if (status == 0) {
			return '审核中';
		} else if (status == -1) {
			return '店铺非法';
		} else if (status == 1) {
			return '审核通过';
		}
	}

	function goShop(status, id) {
		if (status == 1) {
			return '<a href="/o2o/shopadmin/shopmanagement?shopId=' + id
					+ '">进入</a>';
		} else {
			return '';
		}
	}
});


0
2
共2条回复