记:一次前端项目中出现的问题(node为后台,前后端分离技术实现)

1.获取表单提交的数据

$('form').serialize()

可以直接获取表单提交的所有数据,转化成:a=1&b=2&c=3&d=4&e=5
注:表单中需要提交数据的元素必须有 name属性才可以

2.关于art-template的使用

1).在html页面中定义一个template模板页面

<template id='row'>
         {{each data}}
        <tr>
            <td>
                <div class="ui ribbon label {{$value.isdel==0?'blue':'red'}}">{{$value.isdel==0?'正常':'删除'}}</div>
                 {{$value.id}}
            </td>
            <td>{{$value.name}}</td>
            <td>{{$value.gender}}</td>
            <td>{{$value.ctime}}</td>
            <td>
                <a href="javascript:;" class="ui button" id='updateBtn'>修改</a>
                <a href="javascript:;" class="ui button" id='updateBtn'>删除</a>
            </td>
        </tr>
        {{/each}}
    </template>

2)在ajax请求成功的函数中进行渲染

 success: function (result) {
                 console.log('数据请求成功')
                 var str = template('row', result)
                 $('#tbd').html(str)//将渲染出来的内容放在页面上
             },

3.关于跨域问题

跨域报错

No 'Access-Control-Allow-Origin' header is present on the requested resource

解决方案:使用cors模块
1)在服务端安装 cors模块
2)在服务端(server.js)用app.use进行注册,启用跨域资源共享

//在服务器端启用cors跨域资源共享,跨域模块必须写在路由模块的前面
const cors = require('cors')
app.use(cors())

注:设置dataType:jsonp,只能解决get请求,而不能解决post请求

4.在network中看到ajax请求成功,却进入到error方法

原因:很大可能是由于返回的数据类型和dataType中的类型不符合,不同设置dataType即可。

5.关于日期格式错误问题

问题:mysql中日期格式正确,读取出来变成 :2012-12-12T04:00:00.000Z(这个就是UTC 通用标准时,以z来标识)
解决办法:在建数据库的时候设置了时间的类型为ctime,改成vchar即可

6.ajax向服务器端post数据时,既没有进入error也没有进入success方法

解决中。。。

猜你喜欢

转载自blog.csdn.net/weixin_42458708/article/details/82557223